开发者

Letting User Draw On a Google Map?

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?


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.


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


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.


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.


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

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜