Question

我需要在Open Layers 3中处理缩放事件。

以下是我的代码：

map_object = new ol.Map({
target: 'map',
controls: controls_list,
interactions: interactions_list,
overlays: [overlay],
layers: [OSM_raster, WFS_layer],
    view: view
});


map_object.on("Zoom", function() {
  console.log('Zooming...');
});

此代码运行时没有错误并显示地图，但控制台没有输出，表明此功能未触发。

我也尝试过：

map_object.on("drag", function() {
  console.log('Dragging...');
});

这也没有做任何事。

如何处理OL3中的地图控制事件的任何帮助将非常感激（特别是缩放！）。注意我已经尝试了缩放＆＃39;以及＆＃39; Zoom＆＃39;对于on方法的类型字段。

Answer 1

只是为了补充一点，您可以查看'propertychange'可用的事件变体，从我看到的，没有明确的.on ('zoom', ...)，但您可以访问'resolution'和其他属性，如以前的评论：

map.getView().on('propertychange', function(e) {
   switch (e.key) {
      case 'resolution':
        console.log(e.oldValue);
        break;
   }
});

Answer 2

尝试moveend事件。（见https://openlayers.org/en/latest/apidoc/module-ol_MapEvent-MapEvent.html#event:moveend）。

Answer 3

您可以管理moveend事件......

我们需要一个全局变量来分配地图的视图缩放级别。我有   将其命名为currentZoomLevel。

有一个moveend事件。让我们使用它，并添加缩放级别   检查功能..

如果有新的缩放级别，我们会触发一个zoomend事件   DOM的文档。

最后，我们需要将zoomend监听器添加到文档元素中。
{{1}}

Source

Answer 4

就像mentioned的tonio一样，侦听缩放变化的方法（在openlayers术语中称为分辨率变化）是

map.getView().on('change:resolution', (event) => {
    console.log(event);
});

我发现这比聆听一般propertychange并手动验证更改是否涉及解决方案要好（更简洁，更轻松）。

使用鼠标按钮时，此操作会迅速触发，因此在启动任何等待更改的计算之前，先进行节制可能是个好主意。

Documentation for View

打开图层3缩放地图事件处理程序

4 个答案: