Google Maps: Attaching Events On Polyline Icons

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 ma

Solution 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));
}