Question

单击按钮后，我覆盖了map.on('dblclick')的默认行为，即放大。

我想在代码的其他部分中检索此行为。

我该怎么做？

编辑：以获得更好的解释。我有一个按钮，当我单击时，它会覆盖地图dblclick上的行为

$('#RemoveArea').on('click', function(){
    map.getInteractions().pop()
    map.on('dblclick', function(evt) {
        evt.preventDefault();
        evt.map.forEachFeatureAtPixel(evt.pixel, function(feature,layer){ 
            featureId = feature.getId()
            areaFeature = feature.getGeometry().getArea()/ 10000;
            totalSelectedArea -= parseFloat(areaFeature.toFixed(2));
        })
    }); 
})

如何再次单击其他btn，使地图的行为与以前相同，即放大地图

  $('#OtherBtn').on('click', function(){
     //...     
  })

有可能吗？

Answer 1

您可以在创建地图时禁用交互

var map = new ol.Map({
  layers [myLayer],
  target: 'map',
  interactions: ol.interaction.defaults({doubleClickZoom: false}),
  view: new ol.View({
    center: [x, y],
    zoom: z
  })
});

要能够打开/关闭交互，您需要将其分配给变量，而不是使用默认值创建它：

var dcz = new ol.interaction.DoubleClickZoom();

var map = new ol.Map({
  layers [myLayer],
  target: 'map',
  interactions: ol.interaction.defaults({doubleClickZoom: false}).extend([dcz]),
  view: new ol.View({
    center: [x, y],
    zoom: z
  })
});

关闭和打开：

dcz.setActive(false);

dcz.setActive(true);

  var layer = new ol.layer.Tile({
    source: new ol.source.OSM()
  });

  var dcz = new ol.interaction.DoubleClickZoom();

  var map1 = new ol.Map({
    target: 'map',
    layers: [layer],
    interactions: ol.interaction.defaults({doubleClickZoom: false}).extend([dcz]),
    view: new ol.View({
      center: [0, 0],
      zoom: 1
    })
  });

  function dczOnOff() {
      dcz.setActive(document.getElementsByName('dcz')[1].checked);
  }

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}
.map {
    width: 100%;
    height: 80%;
}

<link href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" rel="stylesheet" />
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
<div id="map" class="map"></div>
<div style="padding-left: 50px;">
<input type="radio" name="dcz" value="0" size="16" onchange="dczOnOff()"> DCZ OFF</br>
<input type="radio" name="dcz" value="1" size="16" onchange="dczOnOff()" checked> DCZ ON</br>

要么使您的双击侦听器永久处于活动状态，要么让它测试您的按钮是否已打开或关闭双击缩放：

map.on('dblclick', function(evt) {
    if (!dcz.getActive()) {
        evt.map.forEachFeatureAtPixel(evt.pixel, function(feature,layer){ 
            featureId = feature.getId()
            areaFeature = feature.getGeometry().getArea()/ 10000;
            totalSelectedArea -= parseFloat(areaFeature.toFixed(2));
        })
    }
}); 

$('#RemoveArea').on('click', function(){
    dcz.setActive(false);
})

$('#OtherBtn').on('click', function(){
    dcz.setActive(true);
})

或者您需要存储双击侦听器的密钥，以便以后可以取消设置

$('#RemoveArea').on('click', function(){
    key = map.on('dblclick', function(evt) {
        evt.preventDefault();
        evt.map.forEachFeatureAtPixel(evt.pixel, function(feature,layer){ 
            featureId = feature.getId()
            areaFeature = feature.getGeometry().getArea()/ 10000;
            totalSelectedArea -= parseFloat(areaFeature.toFixed(2));
        })
    }); 
})

$('#OtherBtn').on('click', function(){
    ol.Observable.unByKey(key)     
})

Answer 2

因此，我没有找到一种方法来检索dblclick上的缩放比例，但是我能够防止以前覆盖的行为。因此，在点击OtherBtn

之后

我添加了

                map.on('dblclick', function(evt){                        
                    evt.preventDefault();
                })

因此，正如我所说，它不会放大但也不会做其他事情。

编辑：我发现其中的函数为un，而它与on相反。因此，在OtherBtn中我设置了

map.un('dblclick', doubleClickCallback);

其中doubleClickCallback只是我在dblclick之后所做的所有事情的函数，并且会回到聋人的行为

归还dblclick打开图层上地图的默认行为

2 个答案: