首页 > 解决方案 > 使用 Java Webview 在 OpenLayers 6.5 中未触发的单击事件

问题描述

我最近将我们的 Openlayers 版本从 3 升级到了 6.5,并且开始遇到各种交互和监听器的问题,并且无法弄清楚原因。所有这些在 OL 3 中都没有问题

环境:通过 Java WebView 呈现的 OpenLayers 6.5

问题:map.on("click")、SelectInteractions、DragPanInteractions 和 DrawInteractions 都没有触发,原因不明。

到目前为止的调试:我已经确认地图正在完全渲染(所有图层都渲染,我可以通过其他方式添加功能等)。我在 html 正文中添加了一个点击监听器,并确认点击没有被吃掉。我已经确认 addInteraction、on、map 和交互本身都是在引用它们时定义的。

代码:

地图定义

  var map = new ol.Map({
      target : 'map',
      layers : layers,
      pixelRatio : 1,
      view : new ol.View({
          projection : latLonProj,
          center : [ 0, 0 ],
          extent : [ Number.NEGATIVE_INFINITY, -90, Number.POSITIVE_INFINITY, 90 ],
          zoom : 3.5,
          zoomFactor : 1.5,
          minZoom : 3.5
      }),
      interactions: ol.interaction.defaults({
          dragPan: false,
          mouseWheelZoom: false
      }).extend([
          new ol.interaction.DragPan({kinetic: false}),
          new ol.interaction.MouseWheelZoom({duration: 0})
      ])
  });
  ```
SelectInteraction
  ```
  var selectedCountries = [];
  var selectInteraction = new ol.interaction.Select({
              condition : ol.events.condition.click,
              toggleCondition : function(evt) {
                  ...business logic
              },
              style : new ol.style.Style({
                  fill : new ol.style.Fill({
                      color : 'rgba(255, 0, 0, 0.5)'
                  }),
                  stroke : new ol.style.Stroke({
                      color : '#f00',
                      width : 1
                  }),
              })
          });
     ```
     
     Adding/Removing the Interaction (Called through jsConnector from Java controller)
     ```
      setSelectMode : function(enable) {
          console.log("SetSelectMode: " + enable);
          selectMode = enable;
          map.removeInteraction(selectInteraction);
          
          _selectMode = selectMode;
          
          if (!selectMode) {
              return;
          }
          
          map.addInteraction(selectInteraction);  

      }
      ```

  

标签: javascriptopenlayersopenlayers-6

解决方案


推荐阅读