Question

我正在尝试记录与用户界面的互动，因此我希望通过ol.controls（ol.control.Zoom，ol.control.Rotate，{{来获取点击/标签事件1}}）。

但是怎么样？我在docs

中找不到任何内容

Answer 1

我当时也找不到，但我也可能错过了这一点。您可能会忘记特别使用OpenLayers API并使用纯JavaScript。

// Check zoom +/- buttons event
document.querySelector('.ol-zoom').addEventListener('click', evt => {
  if (evt.target.classList.contains('ol-zoom-in')) {
    console.log('Zoom in');
  } else if (evt.target.classList.contains('ol-zoom-out')) {
    console.log('Zoom out');
  }
});

// Check if rotate button clicked (normally visible only if map rotated)
document.querySelector('.ol-rotate').addEventListener('click', evt => {
  console.log('Rotate');
});

// Check if attribution button opened or closed
document.querySelector('.ol-attribution').addEventListener('click', evt => {
  if (evt.currentTarget.classList.contains('ol-collapsed')) {
    console.log('Collapsed');
  } else {
    console.log('Opened');
  }
});

如果您想观察OpenLayers中的事件而不关心点击发生的位置（因为可以通过鼠标滚轮生成缩放事件，双击地图或点击+/-缩放按钮），可能想听ol.View次事件

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

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

PS：您可以在视图中收听其他事件，但我允许您在API中检查它们

如何在Openlayers 4中的ol.control上添加click事件监听器？

1 个答案: