高德地图1.点聚合 2.放大到最大级别后没办法继续显示(点距离过近,或是同一个经纬度)

1.引用
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你申请的key&plugin=AMap.MouseTool,AMap.MarkerClusterer"></script>


2.使用

window.showAllPoint = function(allMarkers) { overlayGroups = []; //清空覆盖物群组集合 markers = []; //清空点的集合 polyline = null; //清空线标记 polyGon = null; //清空面标记 for(var i = 0; i < allMarkers.length; i++) { var point = eval(allMarkers[i].lnglat); var radius = parseFloat(allMarkers[i].radius); //圆半径 //如果是点标记 if(allMarkers[i].types == 1) { //创建点实例 marker = new AMap.Marker({ position: new AMap.LngLat(point[0], point[1]), title: allMarkers[i].name, map: map, icon: allMarkers[i].icon }); if(nowpage == 'gdiframe') marker.content = setInfoContent(allMarkers[i]); marker.on('click', markerClick); markers.push(marker); // 创建覆盖物群组,并将 marker 传给 OverlayGroup //overlayGroups = new AMap.OverlayGroup(markers); // 添加覆盖物群组 //map.add(overlayGroups); } //如果是线标记 else if(allMarkers[i].types == 2) { //创建线实例 polyline = new AMap.Polyline({ path: point, strokeColor: allMarkers[i].color || allMarkers[i].backgrse || "red", strokeOpacity: 1, strokeWeight: 2, strokeStyle: 'solid', strokeDasharray: [10, 5], geodesic: true }); polyline.setMap(map); if(nowpage == 'gdiframe') polyline.content = setInfoContent(allMarkers[i]); polyline.on('click', lineOrFaceClick); } //如果是面/矩形标记 else if(allMarkers[i].types == 3 || (allMarkers[i].types == 4)) { //创建面实例 polyGon = new AMap.Polygon({ path: point, map: map, strokeColor: allMarkers[i].color || allMarkers[i].backgrse || "red", strokeOpacity: 1, strokeWeight: 2, strokeStyle: 'solid', strokeDasharray: [10, 5], fillColor: allMarkers[i].color || allMarkers[i].backgrse || "red", fillOpacity: 0.2, geodesic: true }) if(nowpage == 'gdiframe') polyGon.content = setInfoContent(allMarkers[i]); polyGon.on('click', lineOrFaceClick); } //如果是圆形标记 else if(allMarkers[i].types == 5) { //创建圆实例 polyGon = new AMap.Circle({ center: point, radius: radius, map: map, strokeColor: allMarkers[i].color || allMarkers[i].backgrse || "red", strokeOpacity: 1, strokeWeight: 2, strokeStyle: 'solid', strokeDasharray: [10, 5], fillColor: allMarkers[i].color || allMarkers[i].backgrse || "red", fillOpacity: 0.2, geodesic: true }) if(nowpage == 'gdiframe') polyGon.content = setInfoContent(allMarkers[i]); polyGon.on('click', lineOrFaceClick); } } cluster = new AMap.MarkerClusterer(map, markers, {gridSize: 80});//点聚合
    

// 获取地图的缩放级别,如果级别已经是最高,那么点击后,显示聚合点内的点信息
cluster.on('click',function(e,markers){
if(map.getZoom() == 18){
var itemsContent = "";
e.markers.forEach(function (item, index) {
itemsContent += item.content;
// console.log(itemsContent);
});
e.markers.forEach(function (item, index) {
infoWindow.setContent(itemsContent);
infoWindow.open(map, item.getPosition());
});
}



})


map.setFitView(); }
原文地址:https://www.cnblogs.com/duanzhenzhen/p/11993725.html