Google Maps: Attaching events on polyline icons

余生长醉 提交于 2019-12-12 03:27:44

问题


I have a page where I'm trying to simulate ship locations on a map. Some of these ships are at a location a percentage of the way on a polyline, others are are at a single point marker.

With the ships that are a percentage of the way along a polyline, I'm able to display the icon correctly. What I'd like to do is attach events purely on that icon, and not on the whole polyline.

My code is at http://www.cleancruising.com.au/map_allShipLoc2.asp

I've also tried to alternatively calculate the LatLng of the ship location by using google.maps.geometry.spherical.computeDistanceBetween, but as this uses spherical geometry, the points don't translate properly on a flat map.


回答1:


For calculating the LatLng of the ship location, see this thread from the Google Maps API v3 group, and the example in it

Below is the modified GetPointAtDistance function modified from Mike Williams' (v2) epoly library

// === A method which returns a GLatLng of a point a given distance along the path ===
// === Returns null if the path is shorter than the specified distance ===
google.maps.Polygon.prototype.GetPointAtDistance = function(metres) {
  // some awkward special cases
  if (metres == 0) return this.getPath().getAt(0);
  if (metres < 0) return null;
  if (this.getPath().getLength() < 2) return null;
  var dist=0;
  var olddist=0;
  for (var i=1; (i < this.getPath().getLength() && dist < metres); i++) {
    olddist = dist;
    dist += this.getPath().getAt(i).distanceFrom(this.getPath().getAt(i-1));
  }
  if (dist < metres) {return null;}
  var projection = this.getMap().getProjection(); 
  if (!projection) {
    alert("no projection");
    return; 
  }
  // Project 
  var p1= projection.fromLatLngToPoint(this.getPath().getAt(i-2));
  var p2= projection.fromLatLngToPoint(this.getPath().getAt(i-1));
  var m = (metres-olddist)/(dist-olddist);
  // alert("p1="+p1+" p2="+p2+" m="+m);
  // Unproject 
  return projection.fromPointToLatLng(new google.maps.Point( p1.x + (p2.x-p1.x)*m, p1.y + (p2.y-p1.y)*m));
}


来源:https://stackoverflow.com/questions/14823927/google-maps-attaching-events-on-polyline-icons

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!