解决方法不太理想,不能鼠标悬浮到那里就以那个地方为中心缩放。
解决思路,给百度地图容器添加滚轮事件,然后再阻止滚轮事件冒泡到body上。因为地图容器的缩放是在body上边。
看代码:
代码:
这是一个函数,复制就能直接用
suofang(){
document.querySelector('.bm-view').onmousewheel = e => {
e = e||window.event;
if (e.stopPropagation) { //这是取消冒泡
e.stopPropagation();
} else{
e.cancelBubble = true;
};
if (e.preventDefault) {//这是取消默认行为,要弄清楚取消默认行为和冒泡不是一回事
e.preventDefault();
} else{
e.returnValue = false;
}
//放大 getZoom返回地图当前缩放级别
if (e.wheelDelta > 0) {
this.zoom = this.zoom + 1
if (this.zoom > 19) {
this.zoom = 19
}
}
//缩小
if (e.wheelDelta < 0) {
e.cancelBubble=true;
this.zoom = this.zoom - 1
if (this.zoom < 4) {
this.zoom = 4
}
}
}
},
阻止冒泡代码:
e = e||window.event;
if (e.stopPropagation) { //这是取消冒泡
e.stopPropagation();
} else{
e.cancelBubble = true;
};
if (e.preventDefault) {//这是取消默认行为,要弄清楚取消默认行为和冒泡不是一回事
e.preventDefault();
} else{
e.returnValue = false;
}