百度地图api 热力图上 清空指定区的覆盖物(轮廓)的另一思路
程序员文章站
2022-06-10 16:34:02
...
1.最近公司的新需求:就是点击一个地区就把对应地区轮廓画出来,但是点另一个地区时,之前的地区轮廓还在,而我要的效果就是只显示一个;
于是再网上查找,使用覆盖物清除方法时就会把所有的覆盖物都清掉了,也把热力图清掉了,这明显不是我想要的。
2.盯了一天的地图api。那个画轮廓类有个隐藏(hide)和显示(show)方法能够实现我需要的功能;
3.初始化时
var arrPly = []; //全局变量,存放轮廓对象
function setPolyline() {
var bdary = new BMap.Boundary();
var arrDistrict = ["天河区", "白云区", "荔湾区"]; //添加所有你用到的地区
arrPly = []; //清空数组,避免第二次加载该方法时导致轮廓对象重复
$.each(arrDistrict, function(index, item) {
bdary.get(item, function(result) {
if (result.boundaries.length === 0) {
console.log('未能获取当前输入行政区域:' + item);
return;
}
var ply = new BMap.Polyline(result.boundaries[0], {
strokeWeight: 3,
strokeColor: "#0191fa"
});
arrPly.push({
name: item,
value: ply
});
ply.hide(); //先把全部地区隐藏
map.addOverlay(ply);
});
});
}
function showBoundariy(curDistrict) {
for (var i = 0; i < arrPly.length; i++) {
if (arrPly[i].name == curDistrict) {
arrPly[i].value.show();
map.setViewport(arrPly[i].value.getPath()); //调整视野
} else {
arrPly[i].value.hide();//非当前地区设为隐藏
}
}
}
总结:这个方法虽然不是高大尚,但解决了问题!
注意:each是异步的,可能会出现轮廓对象未初始化完成时你就调用 showBoundariy 方法会报错,要等初始化完成。