如何在arcGIS上恢复默认滚动行为？

Posted 2021-05-04

我有一个问题使用arcGIS API的地图：

当鼠标指针位于地图上方时，将阻止默认页面滚动。我知道我可以在鼠标滚轮事件上使用stopPropagation（）来抑制滚动地图缩放，但这只会导致禁用缩放。该页面仍然无法滚动...

这会导致糟糕的用户体验，尤其是在页面内使用大/全屏幕地图时。

任何的想法？

答案

使用下面的代码（like the esri demo here）禁用视图上的滚动缩放不会阻止触发DOM元素wheel事件，从而阻止默认页面滚动;

  //this prevent the mapView to zoom on wheel but does not make the page to scroll as wanted
  view.on("mouse-wheel", function(event) {
    // disable mouse wheel scroll zooming on the view
    event.stopPropagation();
  });

所以你需要做的是在DOM元素上添加一个轮子事件监听器来处理esri wheel事件，然后做一个event.stopImmediatePropagation()，这样就不会触发取消默认页面滚动的esri wheel事件。

使用API​​ v.4.9，您必须使用的DOM元素具有esri-view-surface类

  var viewSurfaceElem = document.getElementsByClassName("esri-view-surface")[0];
  viewSurfaceElem.addEventListener("wheel", function(event) { event.stopImmediatePropagation(); });

在这里观看现场演示：https://codepen.io/anon/pen/bQLwwm