时间戳

首页 > 解决方案 > 无法在移动设备上使用 OpenLayers 地图滚动页面

scroll - 无法在移动设备上使用 OpenLayers 地图滚动页面

问题描述

我的 Cordova 移动应用程序中有一个包含 OpenLayers 地图的页面。看起来 OpenLayers 捕获了拖动事件，因此当用户触摸地图时无法滚动页面（仅当拖动事件在地图外开始时才有效）。我在这里发现了几个类似的问题（例如，Openlayers 在触摸和拖动地图时无法垂直滚动页面）。所以我的代码现在看起来像这样：

HTML：

<div id="map" tabindex="1"></div>

JS：

var interactions = ol.interaction.defaults({ 
  onFocusOnly: true, 
  altShiftDragRotate: false, 
  pinchRotate: false, 
  doubleClickZoom: false, 
  pinchZoom: false, 
  dragZoom: false, 
  dragPan: false, 
  dragRotate: false, 
  mouseWheelZoom: false 
});

new ol.Map({
    target: "map"
    interactions: interactions,
    layers: [],
    view: new ol.View({
        center: ol.proj.transform([15.523, 49.718], 'EPSG:4326', 'EPSG:3857'),
        zoom: 8,
        minZoom: 7,
        maxZoom: 18
    })
});

不幸的是，无法使用此代码滚动页面事件。

标签： scrolltouchopenlayersdrag

解决方案

推荐阅读