Javascript 从集群分离的标记不会在MarkerClustererPlus中触发单击事件_Javascript_Google Maps_Google Maps Api 3_Markerclusterer

Javascript 从集群分离的标记不会在MarkerClustererPlus中触发单击事件

javascript google-maps google-maps-api-3

Javascript 从集群分离的标记不会在MarkerClustererPlus中触发单击事件,javascript,google-maps,google-maps-api-3,markerclusterer,Javascript,Google Maps,Google Maps Api 3,Markerclusterer,放大后从集群分离的标记并不总是触发单击事件这是我一直在使用的代码： <html> <head> <style> #map { width: 500px; height: 400px; } </style> <script src="https://code.jquery.com/jquery-1.11.0.min.js"></

放大后从集群分离的标记并不总是触发单击事件

这是我一直在使用的代码：

<html>
<head>
    <style>
        #map {
            width: 500px;
            height: 400px;
        }
    </style>
    <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBZWqW7aJrwxQ4MeN10zXxap5a3lHl4iAI&sensor=true"></script>
    <script src="https://google-maps-utility-library-v3.googlecode.com/svn-history/r354/trunk/markerclustererplus/src/markerclusterer_packed.js"></script>
    <script>
        jQuery(document).ready(function () {
            var map;
            var locations = [
                {
                    'lat': 51.3333,
                    'lng': 3.2833
                },
                {
                    'lat': 51.209348,
                    'lng': 3.2246995000000425
                },
                {
                    'lat': 51.209348,
                    'lng': 3.2246995000000425
                },
                {
                    'lat': 51.2070168,
                    'lng': 3.222604400000023
                }
            ];
            var centerPosition = new google.maps.LatLng(50.944282, 3.647766);
            var markers = [];

            var options = {
                zoom: 5,
                center: centerPosition,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            map = new google.maps.Map($('#map')[0], options);

            for (loc in locations) {
                var latLng = new google.maps.LatLng(locations[loc].lat, locations[loc].lng);
                var marker = new google.maps.Marker({
                    position: latLng
                });
                markers.push(marker);
            }
            var markerCluster = new MarkerClusterer(map, markers, {
                averageCenter: true
            });

            google.maps.event.addListener(markerCluster, "click", function (cluster) {
                console.log("Cluster click");
            });

            google.maps.event.addListener(marker, "click", function (cluster) {
                console.log("Marker click");
            });

        });
    </script>
</head>
<body>
<div id="map">

</div>
</body>
</html>


#地图{
宽度：500px；
高度：400px；
}
jQuery（文档）.ready（函数（）{
var映射；
变量位置=[
{
“lat”：51.3333，
“液化天然气”：3.2833
},
{
“纬度”：51.209348，
“液化天然气”：3.2246995000000425
},
{
“纬度”：51.209348，
“液化天然气”：3.2246995000000425
},
{
“lat”：51.2070168，
“液化天然气”：3.2226044000023
}
];
var centerPosition=new google.maps.LatLng（50.944282,3.647766）；
var标记=[]；
变量选项={
缩放：5，
中心：中心位置，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（$（'#map'）[0]，选项）；
对于（位置中的loc）{
var latLng=new google.maps.latLng（位置[loc].lat，位置[loc].lng）；
var marker=new google.maps.marker({
职位：latLng
});
标记器。推（标记器）；
}
var markerCluster=新的MarkerClusterer（地图、标记、{
平均中心：对
});
google.maps.event.addListener（markerCluster，“单击”，函数（集群）{
log（“集群单击”）；
});
google.maps.event.addListener（标记，“单击”，函数（集群）{
console.log（“标记单击”）；
});
});

现在单击簇（包含4个标记）。地图将被放大，现在您将看到一个3个簇和一个标记。单击单个标记不会执行任何操作（不会触发事件）

但是

单击3的簇，地图将进一步放大。现在有一个2的簇，还有一个分离的标记。单击该标记将触发单击事件

这是一个错误，还是我的设置有问题

您可以找到JSFIDLE。

您创建了标记事件侦听器

        google.maps.event.addListener(marker, "click", function (cluster) {
            console.log("Marker click");
        });

在循环的

之外。因此，创建的最后一个标记有事件侦听器，其他标记没有
这应该起作用：
        for (loc in locations) {
            var latLng = new google.maps.LatLng(locations[loc].lat, locations[loc].lng);
            var marker = new google.maps.Marker({
                position: latLng
            });
            markers.push(marker);

            google.maps.event.addListener(marker, "click", function (cluster) {
                console.log("Marker click");
            });
        }