Allow user to draw on google map?

Question

Does anyone know if it is possible to allow the user to draw a line from point A to point B on a Google map?

If so, how is this usually done?

Answer 1

You can use Polylines and specify two or more points using gooogle.maps.LatLng. Here is the JSFiddle Demo :

//create points on the Polylines var flightPlanCoordinates = [ new google.maps.LatLng(37.772323, -122.214897), new google.maps.LatLng(-27.46758, 153.027892) ]; //create the Polyline and feed it points with stroke styling var flightPath = new google.maps.Polyline({ path: flightPlanCoordinates, strokeColor: "#FF0000", strokeOpacity: 1.0, strokeWeight: 2 }); //set the polylines on the map flightPath.setMap(map); 

To be more detailed, as others have shown, coodains can either be entered by the user or by a click event to place markers as points on the map and then supply coodains markers as points for polylines, or you can also create a form in which users can manually enter your address or their lat lng as points for drawing points, but the detailed way to draw polylines is similar to the above example, except that Lat Lng are statically encoded on a demo.

Answer 2

See the polylines documentation. You just need to add the 'click' event to the map and process the line drawing.

Answer 3

They have an example code that allows you to do this (to see how the code just clicks on the source image):

http://code.google.com/apis/maps/documentation/javascript/examples/polyline-complex.html

• Connect the onclick event to your map.
• Add a point to your polyline (the line used for drawing) by looking at the event.LatLng object to get latitude and longitude.
• When the user clicks the button again, the polyline automatically updates the rendering when a new point has been clicked on the array from which it is displayed.

Answer 4

I am going to post a solution on this test page: http://www.comehike.com/draggable_marker.php

There is no solution during this answer, but hopefully I will get this job very soon.

Answer 5

Yes it is. Check out MapMyRun.com for a great use case.