百度地图点聚合缩放,label标签消失

1.本地新建js文件MarkerClusterer.js,内容如下:
var BMapLib = window.BMapLib = BMapLib || {}; (function() {
     var getExtendedBounds = function(map, bounds, gridSize) {
         bounds = cutBoundsInRange(bounds);
         var pixelNE = map.pointToPixel(bounds.getNorthEast());
         var pixelSW = map.pointToPixel(bounds.getSouthWest());
         pixelNE.x += gridSize;
         pixelNE.y -= gridSize;
         pixelSW.x -= gridSize;
         pixelSW.y += gridSize;
         var newNE = map.pixelToPoint(pixelNE);
         var newSW = map.pixelToPoint(pixelSW);
         return new BMap.Bounds(newSW, newNE)
     };
     var cutBoundsInRange = function(bounds) {
         var maxX = getRange(bounds.getNorthEast().lng, -180, 180);
         var minX = getRange(bounds.getSouthWest().lng, -180, 180);
         var maxY = getRange(bounds.getNorthEast().lat, -74, 74);
         var minY = getRange(bounds.getSouthWest().lat, -74, 74);
         return new BMap.Bounds(new BMap.Point(minX, minY), new BMap.Point(maxX, maxY))
     };
     var getRange = function(i, mix, max) {
         mix && (i = Math.max(i, mix));
         max && (i = Math.min(i, max));
         return i
     };
     var isArray = function(source) {
         return '[object Array]' === Object.prototype.toString.call(source)
     };
     var indexOf = function(item, source) {
         var index = -1;
         if (isArray(source)) {
             if (source.indexOf) {
                 index = source.indexOf(item)
             } else {
                 for (var i = 0,
                 m; m = source[i]; i++) {
                     if (m === item) {
                         index = i;
                         break;
                     }
                 }
             }
         }
         return index
     };
     var MarkerClusterer = BMapLib.MarkerClusterer = function(map, options) {
         if (!map) {
             return
         }
         this._map = map;
         this._markers = [];
         this._clusters = [];
         var opts = options || {};
         this._gridSize = opts["gridSize"] || 60;
         this._maxZoom = opts["maxZoom"] || 18;
         this._minClusterSize = opts["minClusterSize"] || 2;
         this._isAverageCenter = false;
         if (opts['isAverageCenter'] != undefined) {
             this._isAverageCenter = opts['isAverageCenter']
         }
         this._styles = opts["styles"] || [];
         var that = this;
         this._map.addEventListener("zoomend",
         function() {
             that._redraw()
         });
         this._map.addEventListener("moveend",
         function() {
             that._redraw()
         });
         var mkrs = opts["markers"];
         isArray(mkrs) && this.addMarkers(mkrs)
     };
     MarkerClusterer.prototype.addMarkers = function(markers) {
         for (var i = 0,
         len = markers.length; i < len; i++) {
             this._pushMarkerTo(markers[i])
         }
         this._createClusters()
     };
     MarkerClusterer.prototype._pushMarkerTo = function(marker) {
         var index = indexOf(marker, this._markers);
         if (index === -1) {
             marker.isInCluster = false;
             this._markers.push(marker)
         }
     };
     MarkerClusterer.prototype.addMarker = function(marker) {
         this._pushMarkerTo(marker);
         this._createClusters()
     };
     MarkerClusterer.prototype._createClusters = function() {
         var mapBounds = this._map.getBounds();
         var extendedBounds = getExtendedBounds(this._map, mapBounds, this._gridSize);
         for (var i = 0,
         marker; marker = this._markers[i]; i++) {
             if (!marker.isInCluster && extendedBounds.containsPoint(marker.getPosition())) {
                 this._addToClosestCluster(marker)
             }
         }
     };
     MarkerClusterer.prototype._addToClosestCluster = function(marker) {
         var distance = 4000000;
         var clusterToAddTo = null;
         var position = marker.getPosition();
         for (var i = 0,
         cluster; cluster = this._clusters[i]; i++) {
             var center = cluster.getCenter();
             if (center) {
                 var d = this._map.getDistance(center, marker.getPosition());
                 if (d < distance) {
                     distance = d;
                     clusterToAddTo = cluster
                 }
             }
         }
         if (clusterToAddTo && clusterToAddTo.isMarkerInClusterBounds(marker)) {
             clusterToAddTo.addMarker(marker)
         } else {
             var cluster = new Cluster(this);
             cluster.addMarker(marker);
             this._clusters.push(cluster)
         }
     };
     MarkerClusterer.prototype._clearLastClusters = function() {
         for (var i = 0,
         cluster; cluster = this._clusters[i]; i++) {
             cluster.remove()
         }
         this._clusters = [];
         this._removeMarkersFromCluster()
     };
     MarkerClusterer.prototype._removeMarkersFromCluster = function() {
         for (var i = 0,
         marker; marker = this._markers[i]; i++) {
             marker.isInCluster = false
         }
     };
     MarkerClusterer.prototype._removeMarkersFromMap = function() {
         for (var i = 0,
         marker; marker = this._markers[i]; i++) {
             marker.isInCluster = false;
             tmplabel = marker.getLabel();
             this._map.removeOverlay(marker);
             marker.setLabel(tmplabel)
         }
     };
     MarkerClusterer.prototype._removeMarker = function(marker) {
         var index = indexOf(marker, this._markers);
         if (index === -1) {
             return false
         }
         tmplabel = marker.getLabel();
         this._map.removeOverlay(marker);
         marker.setLabel(tmplabel);
         this._markers.splice(index, 1);
         return true
     };
     MarkerClusterer.prototype.removeMarker = function(marker) {
         var success = this._removeMarker(marker);
         if (success) {
             this._clearLastClusters();
             this._createClusters()
         }
         return success
     };
     MarkerClusterer.prototype.removeMarkers = function(markers) {
         var success = false;
         for (var i = 0; i < markers.length; i++) {
             var r = this._removeMarker(markers[i]);
             success = success || r
         }
         if (success) {
             this._clearLastClusters();
             this._createClusters()
         }
         return success
     };
     MarkerClusterer.prototype.clearMarkers = function() {
         this._clearLastClusters();
         this._removeMarkersFromMap();
         this._markers = []
     };
     MarkerClusterer.prototype._redraw = function() {
         this._clearLastClusters();
         this._createClusters()
     };
     MarkerClusterer.prototype.getGridSize = function() {
         return this._gridSize
     };
     MarkerClusterer.prototype.setGridSize = function(size) {
         this._gridSize = size;
         this._redraw()
     };
     MarkerClusterer.prototype.getMaxZoom = function() {
         return this._maxZoom
     };
     MarkerClusterer.prototype.setMaxZoom = function(maxZoom) {
         this._maxZoom = maxZoom;
         this._redraw()
     };
     MarkerClusterer.prototype.getStyles = function() {
         return this._styles
     };
     MarkerClusterer.prototype.setStyles = function(styles) {
         this._styles = styles;
         this._redraw()
     };
     MarkerClusterer.prototype.getMinClusterSize = function() {
         return this._minClusterSize
     };
     MarkerClusterer.prototype.setMinClusterSize = function(size) {
         this._minClusterSize = size;
         this._redraw()
     };
     MarkerClusterer.prototype.isAverageCenter = function() {
         return this._isAverageCenter
     };
     MarkerClusterer.prototype.getMap = function() {
         return this._map
     };
     MarkerClusterer.prototype.getMarkers = function() {
         return this._markers
     };
     MarkerClusterer.prototype.getClustersCount = function() {
         var count = 0;
         for (var i = 0,
         cluster; cluster = this._clusters[i]; i++) {
             cluster.isReal() && count++
         }
         return count
     };
     function Cluster(markerClusterer) {
         this._markerClusterer = markerClusterer;
         this._map = markerClusterer.getMap();
         this._minClusterSize = markerClusterer.getMinClusterSize();
         this._isAverageCenter = markerClusterer.isAverageCenter();
         this._center = null;
         this._markers = [];
         this._gridBounds = null;
         this._isReal = false;
         this._clusterMarker = new BMapLib.TextIconOverlay(this._center, this._markers.length, {
             "styles": this._markerClusterer.getStyles()
         })
     }
     Cluster.prototype.addMarker = function(marker) {
         if (this.isMarkerInCluster(marker)) {
             return false
         }
         if (!this._center) {
             this._center = marker.getPosition();
             this.updateGridBounds()
         } else {
             if (this._isAverageCenter) {
                 var l = this._markers.length + 1;
                 var lat = (this._center.lat * (l - 1) + marker.getPosition().lat) / l;
                 var lng = (this._center.lng * (l - 1) + marker.getPosition().lng) / l;
                 this._center = new BMap.Point(lng, lat);
                 this.updateGridBounds()
             }
         }
         marker.isInCluster = true;
         this._markers.push(marker);
         var len = this._markers.length;
         if (len < this._minClusterSize) {
             this._map.addOverlay(marker);
             return true
         } else if (len === this._minClusterSize) {
             for (var i = 0; i < len; i++) {
                 tmplabel = this._markers[i].getLabel();
                 this._markers[i].getMap() && this._map.removeOverlay(this._markers[i]);
                 this._markers[i].setLabel(tmplabel)
             }
         }
         this._map.addOverlay(this._clusterMarker);
         this._isReal = true;
         this.updateClusterMarker();
         return true
     };
     Cluster.prototype.isMarkerInCluster = function(marker) {
         if (this._markers.indexOf) {
             return this._markers.indexOf(marker) != -1
         } else {
             for (var i = 0,
             m; m = this._markers[i]; i++) {
                 if (m === marker) {
                     return true
                 }
             }
         }
         return false
     };
     Cluster.prototype.isMarkerInClusterBounds = function(marker) {
         return this._gridBounds.containsPoint(marker.getPosition())
     };
     Cluster.prototype.isReal = function(marker) {
         return this._isReal
     };
     Cluster.prototype.updateGridBounds = function() {
         var bounds = new BMap.Bounds(this._center, this._center);
         this._gridBounds = getExtendedBounds(this._map, bounds, this._markerClusterer.getGridSize())
     };
     Cluster.prototype.updateClusterMarker = function() {
         if (this._map.getZoom() > this._markerClusterer.getMaxZoom()) {
             this._clusterMarker && this._map.removeOverlay(this._clusterMarker);
             for (var i = 0,
             marker; marker = this._markers[i]; i++) {
                 this._map.addOverlay(marker)
             }
             return
         }
         if (this._markers.length < this._minClusterSize) {
             this._clusterMarker.hide();
             return
         }
         this._clusterMarker.setPosition(this._center);
         this._clusterMarker.setText(this._markers.length);
         var thatMap = this._map;
         var thatBounds = this.getBounds();
         this._clusterMarker.addEventListener("click",
         function(event) {
             thatMap.setViewport(thatBounds)
         })
     };
     Cluster.prototype.remove = function() {
         for (var i = 0,
         m; m = this._markers[i]; i++) {
             var tmplabel = this._markers[i].getLabel();
             this._markers[i].getMap() && this._map.removeOverlay(this._markers[i]);
             this._markers[i].setLabel(tmplabel)
         }
         this._map.removeOverlay(this._clusterMarker);
         this._markers.length = 0;
         delete this._markers
     };
     Cluster.prototype.getBounds = function() {
         var bounds = new BMap.Bounds(this._center, this._center);
         for (var i = 0,
         marker; marker = this._markers[i]; i++) {
             bounds.extend(marker.getPosition())
         }
         return bounds
     };
     Cluster.prototype.getCenter = function() {
         return this._center;
     };
 })();


2.将http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js引用更改为本地路径MarkerClusterer.js文件


原因:百度地图点聚合removeOverlay时,将label删改了,上面文件在删除前,将label值取出,删除后再赋值。本人没研究,找别人的文章看的原因。经验证,点聚合缩放时,label值存在
  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Minemap是一种基于Web的地图开发平台,它提供了丰富的地图展示、交互功能和数据分析能力。Minemap官方文档详细介绍了该平台的各项功能和使用方法。 首先,Minemap官方文档介绍了如何快速开始使用该平台。它提供了一系列的API文档,包括地图展示、地图样式设置、地图交互、数据分析等方面的内容。通过仔细阅读这些文档,开发人员可以快速了解Minemap平台的整体架构和基本操作方法。 其次,Minemap官方文档详细介绍了如何定制地图风格。它提供了丰富的地图样式设置选项,开发人员可以自由选择地图的底图、标注样式、背景颜色等,以满足不同项目和用户的需求。通过仔细阅读这些文档,开发人员可以掌握如何根据具体需求定制地图风格。 此外,Minemap官方文档还介绍了地图数据的可视化和分析功能。开发人员可以通过在地图上添加自定义数据图层,并使用各种数据分析工具,例如热力图、聚类等,实现对地理数据的可视化和深入分析。通过仔细阅读这些文档,开发人员可以学习如何使用Minemap平台提供的数据分析功能,从而更好地理解和使用地理数据。 总之,Minemap官方文档是开发人员使用该地图开发平台的重要参考资料。通过仔细阅读和理解这些文档,开发人员可以深入学习和掌握Minemap平台的各项功能和使用方法,从而更好地开发出符合自己需求的地图应用。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值