II want an user to draw a route with polylines on GoogleMaps. I’ve found a way to snap a polyline ( example in the link, code in below ). The code works with the directions service to draw a polyline on a road, the only problem is this only works with G_TRAVELMODE_DRIVING but I want [...]

Autor:

II want an user to draw a route with polylines on GoogleMaps. I’ve found a way to snap a polyline ( example in the link, code in below ). The code works with the directions service to draw a polyline on a road, the only problem is this only works with G_TRAVELMODE_DRIVING but I want to use G_TRAVELMODE_WALKING and when you use WALKING you have to supply the map and a div in the constructor of the directions object. When I do that it automatically removes the last line and only displays the current line. I’ve tried several things like supplying the map as null, or leaving out the map in the constructor.. I’ve also tried to give a second map in the constructor, get the polylines from the directions service and display them on the right map. But nothing works! I’d appreciate it if someone could help me!

http://econym.org.uk/gmap/example_snappath.htm

if (GBrowserIsCompatible()) {

  var map = new GMap2(document.getElementById("map"));
  map.setCenter(new GLatLng(53.7877, -2.9832),13)
  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  var dirn = new GDirections();

  var firstpoint = true;
  var gmarkers = [];
  var gpolys = [];
  var dist = 0;

  GEvent.addListener(map, "click", function(overlay,point) {
    // == When the user clicks on a the map, get directiobns from that point to itself ==
    if (!overlay) {
      if (firstpoint) {
        dirn.loadFromWaypoints([point.toUrlValue(6),point.toUrlValue(6)],{getPolyline:true});
      } else {
        dirn.loadFromWaypoints([gmarkers[gmarkers.length-1].getPoint(),point.toUrlValue(6)],{getPolyline:true});
      }
    }
  });

  // == when the load event completes, plot the point on the street ==
  GEvent.addListener(dirn,"load", function() {
    // snap to last vertex in the polyline
    var n = dirn.getPolyline().getVertexCount();
    var p=dirn.getPolyline().getVertex(n-1);
    var marker=new GMarker(p);
    map.addOverlay(marker);
    // store the details
    gmarkers.push(marker);
    if (!firstpoint) {
      map.addOverlay(dirn.getPolyline());
      gpolys.push(dirn.getPolyline());
      dist += dirn.getPolyline().Distance();
      document.getElementById("distance").innerHTML="Path length: "+(dist/1000).toFixed(2)+" km. "+(dist/1609.344).toFixed(2)+" miles.";
    }
    firstpoint = false;
  });

  GEvent.addListener(dirn,"error", function() {
    GLog.write("Failed: "+dirn.getStatus().code);
  });

}
else {
  alert("Sorry, the Google Maps API is not compatible with this browser");
}

Related posts:

  1. How to snap a polyline to a road with walking travelmode in Google Maps?
  2. How Can I Change The Color Of Polyline Back to The Previous One On Click Google Api V2 C# Web App?
  3. How To Create Polyline Between Two Custom Gicon Google Map Api V 2 C# Web Apps
  4. How To Create Polyline Between Two Custom Gicon Google Map Api V 2 C# Web Apps
  5. Why long Google Maps V3 polyline doesn’t appear on OpenstreetMap layer?

Comments on this entry (no comments)

Did you like this post? You can share your opinion with us! Simply click here.

Add Your Comment