处理多个标记时，在标记单击事件后显示折线。

Question

我正在开发一个使用 Google Maps API v3 的网络应用程序。我在一小时内创建了大约 400 个标记，这些标记被推送到 currentDisplayedMarkers[] 中。对于每个标记，我正在创建一个包含其过去位置的折线。这工作正常。但是，我只想在单击特定标记时显示标记的折线。我创建了一个名为 addClickHandler 的函数，在其中我为每个标记定义了 onClick 侦听器。单击标记时，应将折线添加到地图中。

当我单击标记时，折线未显示在地图上。 你对我做错了什么有任何想法吗？

    if (!found)
                   {
                       var LatLng = { lat: data[i].Plots[0].Latitude, lng: data[i].Plots[0].Longitude };
                       createMarker(LatLng, 90, data[i].TrackNumber);
                       drawPolyline(data[i].Plots);
                   }
function createMarker(markerLatLng, direction, id) {
var iconImage = {
    path: 'M265.54,0H13.259C5.939,0,0.003,5.936,0.003,13.256v252.287c0,7.32,5.936,13.256,13.256,13.256H265.54c7.318,0,13.256-5.936,13.256-13.256V13.255C278.796,5.935,272.86,0,265.54,0z M252.284,252.287H26.515V26.511h225.769V252.287z',
    strokeColor: '#800000',
    scale: 0.05,
    fillOpacity: 1,
    strokeWeight: 1
}
//draw the marker and attach it to the map
marker = new google.maps.Marker({
    position: markerLatLng,
    map: map,
    icon: iconImage,
    draggable: false
});
//add aditional properties to the marker
marker.metadata = {
    id: id
};

//add the marker to the markers array
currentlyDisplayedMarkers.push(marker);
for (var j = 0; j < currentlyDisplayedMarkers.length; j++) {
    var pathMarker = currentlyDisplayedMarkers[j];
    addClickHandler(pathMarker);
}
}
function addClickHandler(pathMarker) {
google.maps.event.addListener(pathMarker, 'click', function () {
    flightPath.setMap(map);
});
}

Answer 1

您应该将下面的块移动到您的createMarker() 函数之外。

for (var j = 0; j < currentlyDisplayedMarkers.length; j++) {
    var pathMarker = currentlyDisplayedMarkers[j];
    addClickHandler(pathMarker);
}

每次创建标记时，只需将事件处理程序添加到每个标记，就无需遍历当前的 DisplayedMakers 集合。

只需为您刚刚创建的标记添加一个事件处理程序就足够了。

解决方案： 要么将迭代移到你的标记创建函数之外，要么只为你刚刚在标记创建函数中创建的标记添加一个事件处理程序。