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.
Google Maps Platform offers Cloud-based maps styling features that make it easy to style, customize, and manage your maps using the Google Cloud Console, letting you create a customized map experience for your users without having to update your apps' code each time you make a style change.
Use Cloud-based Maps Styling To get started with Cloud-based maps styling, copy the JSON style above, then go to the Google Cloud console. To create a new map style, paste the JSON into the 'Import JSON' option. Cloud-based maps styling is available for the Maps JavaScript API at no extra charge.
In the Google Cloud Console, go to the Map Styles page. Select the style you want, and click Customize Style.
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.
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.net/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With