Create a Plus Symbol (+) with an SVG Path

Question

Im trying to create a + sign as an SVG path for a google maps project. The plus symbol will be plotted along a polyline using the Icon path property. So far I've manage to get close, my plus symbol currently looks like a horizontal line with the vertical set at one end "-|". I need it to appear in the middle of the horizontal line to make it look like a plus.

My current path is set using the following path command:

path: 'M 0,-1 0,1 H -1,1 0,1'

How should I alter this to achieve my plus symbol? I can find lots of examples for much more complex shapes, curves, gradient fills and such forth but with my limited knowledge Im struggling to find the correct coordinates to express my shape!

Answer 1

I think what you want is:

path: 'M0,-1 V1 M-1,0 H1'

Which translates as start at (0, -1), draw vertically 1 unit, then move to (-1, 0) and draw horizontally 1 unit.

Answer 2

Whilst Im fairly sure this isn't the most succinct way to describe this path Ive managed to construct a plus sign using the following path statement [More by trial and error and some very fuzzy memories of Turtle]:

path: 'M 0,0 H 0.5,0.5 1,1 M 0,0 V 0.5,0.5 1,1 M 0,0 H -0.5,-0.5 -1,-1 M 0,0 V -0.5,-0.5 -1,-1',