Openlayers的Overlay里面不支持移动端滚动事件

Posted 2023-03-19

参考技术A   我用官方例子中的 Popup 做了一个属性查看面板。因为图片需要水平滚动，在PC端浏览器通过鼠标拖动滑动条是没有问题的。但在手机浏览器里却出现了问题，拖动完全没有反应。

  官方Github也有人提到过类似的问题:

  由其中的描述可以知道Overlay的touchmove事件被阻止是有理由的。如果不加以阻止的话，那么我们拖动overlay的时候地图也跟着动了。这个touchmove事件连同其它几个事件被阻止传递到地图视口，以防止我们无法操作Overlay里面的内容。举个例子，如果双击事件没有被阻止传递的话，那么双击Overlay就会出现地图级别放大。

  正如 #3253 所解决的那样，我们需要对Overlay里面需要滚动的内容单独进行操作。捕获touchmove事件，并在事件处理函数里面阻止它进一步冒泡。

对于Openlayers如何禁用Overlay里的touchmove，我目前还不清楚这是如何实现的，留待考证。