勉强解决arcGIS API for JS 中,地图设置scale属性后,缩放地图时地图自动偏移的问题

场景描述:
专题图使用scale或者setScale设置了一个比例尺,鼠标滚轮下滑,比例尺缩小,地图缩小。
当比例尺达到设置的scale值,地图不再缩小,但是会自动偏移,随机向四面八方偏移。
通俗点来讲就是地图在乱飘。

问题原因:
其实我也没整明白,但经过几次测试,发现是个那个scale属性有关,无论是在地图创建的时候写scale属性,还是在后面使用setScale的方法设置,都出现了乱飘这个问题。

解决办法:
那就不要这个scale了呗,手动整一个。
大概逻辑:

监听地图的mouse-wheel事件
获取当前比例尺
if(鼠标上滑){
   启用鼠标滚轮缩放事件;
   }else if(鼠标下滑){
if(当前比例尺>=目标比例尺){
   禁用鼠标滚轮缩放事件
   }else{
   启用鼠标滚轮缩放事件
  }
}

用到的函数和事件介绍:

  1. mouse-wheel事件:map.on("mouse-wheel",function(event){};
    鼠标上滑时,event.value = 1;下滑时为-1.

这里最好还是在地图上监听事件,而不是在整个网页,一是网页可能还有其他内容需要用到滚轮;二是网页的鼠标滚轮事件,判断上滑下滑这个,需要做不同浏览器的适配。

温馨提示:监听的是mouse-whell事件而不是地图缩放事件哦,监听地图缩放事件的话,禁用缩放以后,就不能再把它放出来了。

  1. 获取地图当前比例尺
    var scale = map.getScale();

  2. 禁用下滑事件
    map.disableScrollWheelZoom();

  3. 启用下滑事件
    map.enableScrollWheelZoom();

温馨提示:禁用了下滑事件以后,一定要记得把下滑事件放出来哦!!!!

最后,解释下为什么说是勉强解决了这个问题,因为如果鼠标滑得太快的话,可能地图已经无限缩放成一个渺小的点了,程序还没有执行到禁用缩放事件那里,影响也不是很严重,比乱飘还是要好些。

而且这个问题还不是很好解决,本来想用setTimeOut延时一下的,但是需要延时的是arcGIS的鼠标滚轮缩放事件,不是我自己写的那个事件,有、、复杂。

posted on 2021-06-28 16:03  northwest  阅读(2058)  评论(0编辑  收藏  举报

导航