場景描述:
專題圖使用scale或者setScale設置了一個比例尺,鼠標滾輪下滑,比例尺縮小,地圖縮小。
當比例尺達到設置的scale值,地圖不再縮小,但是會自動偏移,隨機向四面八方偏移。
通俗點來講就是地圖在亂飄。
問題原因:
其實我也沒整明白,但經過幾次測試,發現是個那個scale屬性有關,無論是在地圖創建的時候寫scale屬性,還是在后面使用setScale的方法設置,都出現了亂飄這個問題。
解決辦法:
那就不要這個scale了唄,手動整一個。
大概邏輯:
監聽地圖的mouse-wheel事件
獲取當前比例尺
if(鼠標上滑){
啟用鼠標滾輪縮放事件;
}else if(鼠標下滑){
if(當前比例尺>=目標比例尺){
禁用鼠標滾輪縮放事件
}else{
啟用鼠標滾輪縮放事件
}
}
用到的函數和事件介紹:
- mouse-wheel事件:map.on("mouse-wheel",function(event){};
鼠標上滑時,event.value = 1;下滑時為-1.
這里最好還是在地圖上監聽事件,而不是在整個網頁,一是網頁可能還有其他內容需要用到滾輪;二是網頁的鼠標滾輪事件,判斷上滑下滑這個,需要做不同瀏覽器的適配。
溫馨提示:監聽的是mouse-whell事件而不是地圖縮放事件哦,監聽地圖縮放事件的話,禁用縮放以后,就不能再把它放出來了。
-
獲取地圖當前比例尺
var scale = map.getScale(); -
禁用下滑事件
map.disableScrollWheelZoom(); -
啟用下滑事件
map.enableScrollWheelZoom();
溫馨提示:禁用了下滑事件以后,一定要記得把下滑事件放出來哦!!!!
最后,解釋下為什么說是勉強解決了這個問題,因為如果鼠標滑得太快的話,可能地圖已經無限縮放成一個渺小的點了,程序還沒有執行到禁用縮放事件那里,影響也不是很嚴重,比亂飄還是要好些。
而且這個問題還不是很好解決,本來想用setTimeOut延時一下的,但是需要延時的是arcGIS的鼠標滾輪縮放事件,不是我自己寫的那個事件,有、、復雜。