让用户在Google地图上绘图？

Question

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

If so, how is this usually done?

Answer 1

Look at the documentation on polylines . You just need to add an 'click' event on the map and handle the drawing of the lines.

Answer 2

You can use the Polylines and specify two points or more using gooogle.maps.LatLng. Here is a 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 much more detail as others suggests, the coodinates can be either entered by user either by a click event to place markers as points on the map and then supply the markers coodinates as points for the polylines or you can also create a form where the users can manually enter their address or their lat lng as points to draw the points, but the detail way of drawing the polylines is similar to the above example except Lat Lng are statically coded on the demo.

Answer 3

They have sample code which allows you to do this(to see the code simply click view source):

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

1. Wire an onclick event to your map.
2. Add a point to your polyline(the line the use is drawing) by looking at the event.LatLng object to get the Latitude and Longitude.
3. When the user clicks again the polyline will automatically update the rendering when the new point has been pushed onto the array it renders from.

Answer 4

I am going to be posting the solution on this test page: http://www.comehike.com/draggable_marker.php

At the time of this answer, the solution is not there, but hopefully very soon I will get this working.

Answer 5

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