Google maps 使用for循环将marker clusterer添加到google地图？

因为我展示了选择抵制仇恨报纸的报摊。到目前为止，包含14个条目的最小化地图效果良好。但也有一些地区有不止一家商店，谷歌地图似乎只显示一个标记：

我知道实际上还有更多，如果你缩放这些位置，其他标记就会出现。但是如果这个标记周围有更多的标记，那么聚类会更好，它会显示标记的数量。我在GitHub上发现了这个，但即使是简单的示例，我也不知道如何将这个库添加到我的地图中。也许我对for循环有点困惑，为了显示标记

其来源基本上是：

html{height:100%}正文{height:100%；边距：0；填充：0；}a{文本装饰：无；颜色：#000；}地图#画布{height:100%}
变量=[
[51.418288,7.339213，“EDEKA Schwalemeyer，Bommerfelder环110，58452 Witten，Nordrhein Westfalen.Quelle:http://goo.gl/jQe2Oo"],
[51.418266,7.342316，“Bonema Trinkhalle&Minishop，Bommerfelder Ring 86，58452 Witten，Nordrehein Westfalen.魁尔：http://goo.gl/jQe2Oo"],	
[51.422492,7.338546，“北莱茵-威斯特法伦州威顿58452号Brenschen 21区自助服务亭。奎尔：http://goo.gl/jQe2Oo"],
[51.415127,7.337124，“霍尔佐芬·卡克雷，埃尔伯费尔德大街11号，威顿58452号，北莱茵-威斯特法伦。魁尔：http://goo.gl/jQe2Oo"]
];
函数初始化（）
{ 
var map=new google.maps.map（document.getElementById（'map_canvas'）；
map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push（legende）；
var bounds=new google.maps.LatLngBounds（）；
var infowindow=new google.maps.infowindow（）；
var image={url:“bildfrei.png”，大小：new google.maps.size（32,32），}；
for（Orte中的var i）
{
var p=Orte[i]；
var latlng=new google.maps.latlng（p[0]，p[1]）；bounds.extend（latlng）；
var marker=new google.maps.marker（{position:latlng，map:map，title:p[2]，icon:image}）；
google.maps.event.addListener（标记，'click'，function（）{infowindow.setContent（this.title）；infowindow.open（map，this）；}）；
}		 
映射边界（bounds）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；	 

您的标记没有被聚集，因为您从未将它们添加到MarkerClusterer。解决此问题的一种方法是在创建它们时添加它们：

for (var i in Orte) {
    var p = Orte[i];
    var latlng = new google.maps.LatLng(p[0], p[1]);
    bounds.extend(latlng);
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: p[2],
        icon: image
    });
    markerCluster.addMarker(marker);
    google.maps.event.addListener(marker, 'click', function () {
        infowindow.setContent(this.title);
        infowindow.open(map, this);
    });
}

代码段：

var-Orte=[
[51.418288，7.339213，“EDEKA Schwalemeyer，Bommerfelder环110，58452 Witten，Nordrhein Westfalen.Quelle:http://goo.gl/jQe2Oo"],
[51.418266，7.342316，“Bonema Trinkhalle&Minishop，Bommerfelder Ring 86，58452 Witten，Nordrehein Westfalen.魁尔：http://goo.gl/jQe2Oo"],
[51.422492，7.338546，“北莱茵-威斯特法伦州威滕市布伦森21号，58452号，奥夫·德姆·维滕的小亭。奎勒：http://goo.gl/jQe2Oo"],
[51.415127，7.337124，“霍尔佐芬·卡克雷，埃尔伯费尔德大街11号，威顿，北莱茵-威斯特法伦，58452号。魁尔：http://goo.gl/jQe2Oo"]
];
函数初始化（）{
var map=new google.maps.map（document.getElementById（'map_canvas'）；
var markerCluster=新的MarkerClusterer（地图、标记）；
//map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push（legende）；
var bounds=new google.maps.LatLngBounds（）；
var infowindow=new google.maps.infowindow（）；
变量图像={
url:“bildfrei.png”，
大小：新的google.maps.size（32,32），
};
for（Orte中的var i）{
var p=Orte[i]；
var latlng=new google.maps.latlng（p[0]，p[1]）；
边界扩展（latlng）；
var marker=new google.maps.marker({
位置：latlng，
地图：地图，
标题：p[2]
/*,
图标：图像*/
});
markerCluster.addMarker（marker）；
google.maps.event.addListener（标记'click'，函数（）{
infowindow.setContent（this.title）；
打开（地图，这个）；
});
}
映射边界（bounds）；
google.maps.event.addListenerOnce（映射'bounds_changed'，函数（）{
var newZoom=map.getZoom（）-2；
map.setZoom（newZoom）；
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）
html{
身高：100%
}
身体{
身高：100%；
保证金：0；
填充：0；
}
a{
文字装饰：无；
颜色：#000；
}
#地图容器{
填充：6px；
边框宽度：1px；
边框样式：实心；
边框颜色：#ccc#ccc#999#ccc；
-webkit盒阴影：rgba（64,64,64,0.5）0 2px 5px；
-moz盒阴影：rgba（64,64,64,0.5）0 2px 5px；
盒影：rgba（64,64,64,0.1）0 2px 5px；
宽度：600px；
身高：100%；
}
#地图画布{
身高：100%
}

在您尝试添加markerclusterer的地方，代码是什么样子的？你有没有看过关于SO的类似问题？@geocodezip我更新了上面的帖子。我在帖子的代码中发现了一个javascript错误：
Uncaught ReferenceError:legende没有定义
Awesome！非常感谢！：-）