百度地圖滾輪縮放時產生位置偏移 問題

最近在調用百度地圖的過程當中,發生了在地圖上滾輪縮放,結果產生了位置偏移的狀況,一樣在移動端,雙指縮放也有一樣的問題。html

 

這個問題產生的緣由主要是由於百度地圖加載的位置由於定位等緣由,與整個html 頁面產生了不一樣步滾動的問題。spa

百度地圖的縮放是基於body層的,若是body層有滾動條,而且不在最頂端,在當前位置插入了百度地圖,也就是出現該問題時的狀態,這個時候滾輪縮放就會產生偏移。code

 

那麼知道了該問題產生的緣由,解決辦法就會有不少。htm

這裏提供了我在項目中的處理辦法。blog

當地圖加載的時候執行同步

$(window).scrollTop(0);

也就是將父元素滾動到頁面最頂端,由於產生問題都是由於position:fixed; 因此就算滾動到最頂端,地圖也會加載在視圖中,以後縮放就正常了。it

一樣的,在關閉加載地圖的時候要將視圖位置滾回以前所在的位置,這裏我直接大約算了一下距離滾了回去io

$(window).scrollTop(1000);//1000就是約等於以前視圖所在位置距頁面最頂端的距離

 

這個問題就算是解決了。百度地圖

這裏提供的不是最優解決辦法,只是一種思路,有其餘解決辦法歡迎留言意見,謝謝!class

相關文章
相關標籤/搜索