openlayer 监听鼠标滚动事件和移动事件

在OpenLayers中，监听地图的鼠标滚动事件（Wheel Event）以及移动事件（Move Event）可以让你响应用户的交互。以下是如何实现这两个事件的例子：

1. **监听鼠标滚动事件（Zoom）**:

var map = new ol.Map({
  target: 'map', // 容器元素id
  layers: [...], // 图层列表
  view: new ol.View(...) // 视图配置
});

map.on('mousewheel', function(event) {
  var delta = Math.max(-1, Math.min(1, event.detail || -event.wheelDelta)); // 鼠标滚轮方向
  var view = map.getView();
  
  if (delta < 0) { // 缩小地图
    view.zoomIn();
  } else {
    view.zoomOut();
  }
});

这里，我们通过`on`方法绑定了一个回调函数，当鼠标滚轮滚动时，会根据滚轮的正负方向调整地图的缩放。

2. **监听地图移动事件（Move）**:

map.on('moveend', function(event) {
  var center = map.getView().getCenter(); // 获取新的中心点坐标
  console.log('地图移动后，新的中心点：', center);
});

在地图移动结束后，`moveend`事件会被触发，这时你可以访问`view.getCenter()`得到新的中心点位置。