谷歌地图：添加每个多边形的点击监听器

我正在开发一个web应用程序。我有一个谷歌地图，我从数组中添加多边形。我遍历该数组并将多边形添加到地图。我还需要一个事件侦听器添加到多边形的点击，并提醒多边形谷歌地图：添加每个多边形的点击监听器

这个位置是我在做什么

map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 
//Loop on the polygonArray 
for (var i = 0; i < polygonArray.length; i++) { 
    //Add the polygon 
    var p = new google.maps.Polygon({ 
     paths: polygonArray[i], 
     strokeWeight: 0, 
     fillColor: '#FF0000', 
     fillOpacity: 0.6, 
     indexID: i 
    }); 
    p.setMap(map); 

    //Add the click listener 
    google.maps.event.addListener(p, 'click', function (event) { 
     //alert the index of the polygon 
     alert(p.indexID); 
    }); 
}

问题

的多边形绘图都正确。然而，问题是，当我尝试点击一个多边形时，它总是显示最后一个索引。它就像它只是点击最后添加的多边形。我想当我添加一个新的监听器时，它会覆盖旧监听器。如何为每个添加的多边形添加一个侦听器以提醒正确的索引？

谢谢

来源

2013-03-04 Youssef

[为每个多边形谷歌地图V3打开信息窗口（的可能重复http://stackoverflow.com/questions/13017915/open-infowindow-for-each-polygon-google-maps- v3） – geocodezip 2013-03-04 19:24:50

这个问题的实质是，所有'函数共享相同的'p' （事件）关闭_以及循环块_。因此，当循环执行时，'p'被绑定到最后创建的多边形。我会使用'polygonArray.forEach'来分离变量。 – 2016-03-07 17:18:48

这是正常的行为。有，我能想到的两个解决方案：

1）我相信你能找回从上下文多边形（我没有测试）：

google.maps.event.addListener(polygon, 'click', function (event) { 
    alert(this.indexID); 
});

2）你也可以使用一些closures：

var addListenersOnPolygon = function(polygon) { 
    google.maps.event.addListener(polygon, 'click', function (event) { 
    alert(polygon.indexID); 
    }); 
} 

map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 
//Loop on the polygonArray 
for (var i = 0; i < polygonArray.length; i++) { 
    //Add the polygon 
    var p = new google.maps.Polygon({ 
     paths: polygonArray[i], 
     strokeWeight: 0, 
     fillColor: '#FF0000', 
     fillOpacity: 0.6, 
     indexID: i 
    }); 
    p.setMap(map); 
    addListenersOnPolygon(p); 
}

来源

2013-03-04 19:16:36 SuperSkunk

谷歌地图：添加每个多边形的点击监听器

回答

相关问题