Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Create a Plus Symbol (+) with an SVG Path

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!

like image 793
Luke Baughan Avatar asked Jan 14 '23 04:01

Luke Baughan


1 Answers

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.

like image 144
Peter Collingridge Avatar answered Apr 27 '23 22:04

Peter Collingridge