对于leaflet使用聚合时出现一个坐标点下有多个标记时处理的方式
var clusterMarkers = L.markerClusterGroup({
showCoverageOnHover : false,
spiderfyOnMaxZoom : true,
disableClusteringAtZoom : 18
});然后再在获取相关标记时clusterMarkers.addLayer(markerT[n]);最后添加到地图；map.addLayer(clusterMarkers);
但是这样的聚合再出现标题中的情况时会出现如下的情况
(1):disableClusteringAtZoom : 18和function initMap(){
map = L.map(‘mapDiv’, {
minZoom : 7,
maxZoom : 18,
crs : L.CRS.EPSG4326,
zoomControl : false,
attributionControl : false
}).setView([23.16,113.28], (6-2)+10);｝｝与初始化map时出现maxZoom为18时这样的聚合在最大级别时所有展开最后同一个点的多个标记都会一层一层被覆盖。
(2):disableClusteringAtZoom : 19和maxZoom : 18时这时候会发现虽然最大级别时还是出现聚合但是有很多不是同一个点的标记也存在聚合中。
解决方案：
修改disableClusteringAtZoom : 19，然后在源代码leaflet.markercluster.js中查找disableClusteringAtZoom 属性，这时候的js进了加密和压缩可以使用在线格式化js的方式获取更易读的js文件。
这时候if (this.options.disableClusteringAtZoom) {
e = this.options.disableClusteringAtZoom – 1
}以及下方的 for (var g = e; g >= 0; g–) {
this._gridClusters[g] = new L.DistanceGrid(f(g));
this._gridUnclustered[g] = new L.DistanceGrid(f(g));
}通过网页的断点调试发现g取得的值无论多少f(g)都是80这时候查看
L.MarkerClusterGroup = L.FeatureGroup.extend({
options: {
maxClusterRadius: 80,
iconCreateFunction: null,
spiderfyOnMaxZoom: true,
showCoverageOnHover: true,
zoomToBoundsOnClick: true,
singleMarkerMode: false,
disableClusteringAtZoom: null,
removeOutsideVisibleBounds: true,
animateAddingMarkers: false,
spiderfyDistanceMultiplier: 1,
chunkedLoading: false,
chunkInterval: 200,
chunkDelay: 50,
chunkProgress: null,
polygonOptions: {}
}中maxClusterRadius的值当你修改为1后运行可以看到意想不到的效果。
但是却不能直接修改这儿的 信息，需要修改
for (var g = e; g >= 0; g–) {
if(g==e){
this._gridClusters[g] = new L.DistanceGrid(1);
this._gridUnclustered[g] = new L.DistanceGrid(1);
}else{
this._gridClusters[g] = new L.DistanceGrid(f(g));
this._gridUnclustered[g] = new L.DistanceGrid(f(g));
}
}这样就可以在最后一个级别时让其聚合的范围缩小到一定这样就可以达到同一点多个标记的效果。
转载自：https://blog.csdn.net/qq_21191657/article/details/79112213
