pmbennett.net

At first glance, I thought this was going to be quite a tricky task, but as it turns out, it is really quite easy. Once you have loaded the Google Maps javascript files, you just need to create a new GPolyline object, and give it the coordinates of the points on your line, along with the colour and the thinkness of the line. All you then need to do is add it as an overlay, and you are done!

	var polyline = new GPolyline([
		new GLatLng(50.86327703482849, -0.08008003234863281),
		new GLatLng(50.85807603889224, -0.07750511169433594),
		// ... more coordinates
	], "#FF0000", 3);
	$map.addOverlay(polyline);

To make things even easier, I found a neat little Google Maps polylines code generator to create the list of coordinates for me!

Tagged as

1. Google maps
2. Javascript
3. Polylines

Subscribe to the RSS feed