解决思路,就是直接替换对应marker的图片。获取marker对象判断点击的marker替换成新图片,上一个被点击的就替换成老图片。
marker.name = 'tag';
marker.id = i; //一定要设置id,我这里是设置的循环key值,要唯一性。
map.addOverlay(marker);
let pointAIcon2= new BMapGL.Icon(require("../xxxxx.png"), new BMapGL.Size(36, 52));
let pointAIcon1= new BMapGL.Icon(require("../xxxxx.png"), new BMapGL.Size(17, 17));
let clickFunction = function(v1,v2) {
return function(event) {
var allOverlay = map.getOverlays();
//获取所有marker
allOverlay.map((item,key) => {
//oldId是上一个点击的marker id
if(item.id === that.oldId){
//setIcon 是替换marker图片
allOverlay[key].setIcon(pointAIcon1);
}
//当前点击的marker
if (item.id === event.target.id) {
allOverlay[key].setIcon(pointAIcon2);
}
})
//延迟保存oldId
setTimeout(() => {
that.oldId=event.target.id
}, 500);
};
}(position.longitude,position.latitude);
marker.addEventListener("click", clickFunction);