vuebaidumap 删除覆盖物_百度地图api清除指定覆盖物

1、首先在官网api demo有如下例子：(地址：http://lbsyun.baidu.com/jsdemo.htm?a#c1_17)

// 百度地图API功能

var map = new BMap.Map("allmap");

var point = new BMap.Point(116.404, 39.915);

map.centerAndZoom(point, 15);

map.disableDoubleClickZoom(true);

// 编写自定义函数,创建标注

function addMarker(point,label){

var marker = new BMap.Marker(point);

map.addOverlay(marker);

marker.setLabel(label);

}

// 随机向地图添加25个标注

var bounds = map.getBounds();

var sw = bounds.getSouthWest();

var ne = bounds.getNorthEast();

var lngSpan = Math.abs(sw.lng - ne.lng);

var latSpan = Math.abs(ne.lat - sw.lat);

for (var i = 0; i < 10; i++) {

var point = new BMap.Point(sw.lng + lngSpan * (Math.random() * 0.7), ne.lat - latSpan * (Math.random() * 0.7));

var label = new BMap.Label("我是id="+i,{offset:new BMap.Size(20,-10)});

addMarker(point,label);

}

function deletePoint(){

var allOverlay = map.getOverlays();

for (var i = 0; i < allOverlay.length -1; i++){

if(allOverlay[i].getLabel().content == "我是id=1"){

map.removeOverlay(allOverlay[i]);

return false;

}

}

}

我们会发现 map.getOverlays() 函数会返回 页面 覆盖物的个数+1 个；

言归正传：在百度api里，清除覆盖物有两个方法：map.removeOverlay()或者 map.clearOverlays()。而 clearOverlays()方法一次移除所有的覆盖物，removeOverlay()一次移除一个指定覆盖物。

现在我的需求是如图：

点击左边的人员后，右边对应的人员显示自己管理的圆圈范围。同时清除 其他人员的圆圈区域(也就是说地图只显示当前管理员的管理区域)，所以每次点击需要清除已有的圆圈。

api又提供了另外2个配套的方法：disableMassClear()  和 enableMassClear();

disableMassClear()：官网文档解释 禁止覆盖物在 map.clearOverlays 方法中被清除。 (自 1.1新增)

enableMassClear()：官网文档解释 允许覆盖物在 map.clearOverlays 方法中被清除。 (自 1.1新增)

实现该功能的步骤如下：

第一步：在添加覆盖的时候对不需要进行移除操作的覆盖设置disableMassClear();

marker.setLabel(label);

this.map.addOverlay(marker);//增加点

marker.disableMassClear(); //mark不被清除

第二步：清除所要清除的覆盖物，这里需要清除所有的Polyline而不清除marker，现在可以直接使用

var circle = new BMap.Circle(poi,dis,{fillColor:"blue", strokeWeight: 1 ,fillOpacity:

0.3,strokeOpacity: 0.3});

this.map.clearOverlays();

this.map.addOverlay(circle);

只需2步，功能就完成了

如果现在需要对marker进行移除操作时，可以使用enableMassClear()方法来取消禁止清除；

var allOverlay = map.getOverlays();

for (var i = 0; i < allOverlay.length; i++) {

allOverlay[i].enableMassClear();

return false;

};

参考：http://blog.csdn.net/frees_zhu/article/details/73743785

全部代码：

window.visualMonitor ={

path:$("#path").val(),

map:new BMap.Map("bdMap"),

initMapBdMap:function(){//初始地图高度

var mapHeight = $(window).height() - 85;

$("#bdMap").css({"height":mapHeight});

$("#treeContainer").niceScroll({

cursoropacitymin: 0,

cursoropacitymax: 1,

zindex:99,

cursorwidth: "5px",

cursorborder: "none",

cursorborderradius