百度地图滚轮缩放时产生位置偏移 问题

最近在调用百度地图的过程当中,发生了在地图上滚轮缩放,结果产生了位置偏移的状况,一样在移动端,双指缩放也有一样的问题。html

 

这个问题产生的缘由主要是由于百度地图加载的位置由于定位等缘由,与整个html 页面产生了不一样步滚动的问题。spa

百度地图的缩放是基于body层的,若是body层有滚动条,而且不在最顶端,在当前位置插入了百度地图,也就是出现该问题时的状态,这个时候滚轮缩放就会产生偏移。code

 

那么知道了该问题产生的缘由,解决办法就会有不少。htm

这里提供了我在项目中的处理办法。blog

当地图加载的时候执行同步

$(window).scrollTop(0);

也就是将父元素滚动到页面最顶端,由于产生问题都是由于position:fixed; 因此就算滚动到最顶端,地图也会加载在视图中,以后缩放就正常了。it

一样的,在关闭加载地图的时候要将视图位置滚回以前所在的位置,这里我直接大约算了一下距离滚了回去io

$(window).scrollTop(1000);//1000就是约等于以前视图所在位置距页面最顶端的距离

 

这个问题就算是解决了。百度地图

这里提供的不是最优解决办法,只是一种思路,有其余解决办法欢迎留言意见,谢谢!class

相关文章
相关标签/搜索