欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js百度地圖鼠標(biāo)滾輪縮放導(dǎo)致地圖中心點(diǎn)偏移問題

 更新時間：2023年02月14日 16:18:19   作者：菑恩_  
本文主要介紹了js百度地圖鼠標(biāo)滾輪縮放導(dǎo)致地圖中心點(diǎn)偏移問題，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

一、問題

帶滾動條的彈窗中的地圖正常顯示，滾輪縮放位置發(fā)生偏移，放大時位置是靠上偏移的，縮小時位置是靠下偏移的, 高德地圖、騰訊地圖不存在此問題，百度地圖存在

二、問題分析

是由于百度地圖默認(rèn)定位是取瀏覽器文檔對象的scrollTop=0的位置, 是由body中心為中心點(diǎn)的, 如果html頁面(或者是彈窗)出現(xiàn)滾動條，那么地圖的中心位置其實(shí)是有偏移的，偏移的距離就是滾動條滾動的距離。這個時候縮放就會出現(xiàn)上述偏移的情況。

三、解決方法

1.禁止?jié)L輪縮放, 添加縮放控件

禁止?jié)L輪縮放, 添加百度地圖縮放控件

  mapCanvas = new BMap.Map("mapBox",  { enableMapClick: false });
  var point = new BMap.Point(116.379341, 39.938776);
  mapCanvas.centerAndZoom(point, 15);
  //彈窗中帶有滾動條  縮放會存在中心點(diǎn)偏移問題
  mapCanvas.disableScrollWheelZoom();     //禁止鼠標(biāo)滾輪縮放
  mapCanvas.addControl(scaleCtrl);
  //平移縮放控件
  mapCanvas.addControl(new BMap.NavigationControl());
  var scaleCtrl = new BMap.ScaleControl();  // 添加比例尺控件

效果:

在這里插入圖片描述

添加縮放效果

2.調(diào)節(jié)滾動條

在彈窗打開的時候，檢查滾輪位置是否在最頂部，如果不在的話，調(diào)整到最頂部，然后在彈窗關(guān)閉的時候，恢復(fù)到最初的位置即可。
解決方法可參考:
調(diào)節(jié)滾動條位置-解決方案

總結(jié)

到此這篇關(guān)于js百度地圖鼠標(biāo)滾輪縮放導(dǎo)致地圖中心點(diǎn)偏移問題的文章就介紹到這了,更多相關(guān)js百度地圖縮放內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論