overlay - 使自定义叠加层可点击(Google Maps API v3)

Question

我有一个自定义的覆盖类(ImageOverlay)，它是从google.maps.OverlayView继承的。我希望它响应Google Maps单击事件(不仅仅是DOM单击事件)，但是仅使用addListener似乎并不能解决问题。

例如我有一个shapes数组，其中包含google.maps.Polygon和ImageOverlay对象的混合物:

for (var i in shapes) {
  google.maps.event.addListener(shapes[i], 'click', function(){alert('hi')});
}

单击多边形会触发警报，但是单击自定义叠加层不会执行任何操作。

如何使Google Maps API将叠加层视为可点击的？

Answer 1

v3更新:overlayLayer不再接受鼠标事件。而是将叠加层添加到overlayMouseTarget中，添加侦听器，并且它应正常接收鼠标事件。

//add element to clickable layer 
this.getPanes().overlayMouseTarget.appendChild(div);

// set this as locally scoped var so event does not get confused
var me = this;

// Add a listener - we'll accept clicks anywhere on this div, but you may want
// to validate the click i.e. verify it occurred in some portion of your overlay.
google.maps.event.addDomListener(div, 'click', function() {
    google.maps.event.trigger(me, 'click');
});

另请: http://code.google.com/apis/maps/documentation/javascript/reference.html#MapPanes