I am using google map api and was wondering if there was anyway of creating a dashed or dotted stroke of a polyline. Would there also be an easy way to create a curved line between two destinations rather than a straight line: the code I currently have draws a straight grey line,

polyline = new google.maps.Polyline( { path: route, strokeColor: "#7d7d7d", strokeOpacity: 0.6, strokeWeight: 5 } );
                    polyline.setMap( map );

Any advice or help would be appreciated, thanks.

I am using google map api and was wondering if there was anyway of creating a dashed or dotted stroke of a polyline. Would there also be an easy way to create a curved line between two destinations rather than a straight line: the code I currently have draws a straight grey line,

polyline = new google.maps.Polyline( { path: route, strokeColor: "#7d7d7d", strokeOpacity: 0.6, strokeWeight: 5 } );
                    polyline.setMap( map );

Any advice or help would be appreciated, thanks.

• javascript
• css
• google-maps

2 Answers 2

Look at my free plugin for curved lines in Google maps, I'ts very basic solution but it gets the job done: http://curved_lines.overfx/

What kind of curved line? You can add geodesic: true to your Polyline options, which will draw curved lines showing the shortest distance between two points (taking into account the curvature of the earth), but they only really are noticeable when zoomed out far enough and the line is between two quite far apart longitudes.