为什么在事件触发器上设置动画会导致 OpenLayers 6.5 中出现无休止的动画循环?

Why is animating on event trigger causing an endless animation loop in OpenLayers 6.5?

我有以下 OpenLayers 地图:

<script type="text/javascript">
  var map = new ol.Map({
    target: 'map',
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM()
      })
    ],
    view: new ol.View({
      center: ol.proj.fromLonLat([-92.5, 38]),
      zoom: 5
    })
  });
  map.on('postcompose', function(e) {
    map.getView().animate({
      zoom: map.getView().getZoom() + 1,
      duration: 2000
    });
    e.preventDefault();
  });
</script>

我的意图是让这张地图自行加载,然后自动放大一级。取而代之的是,这张地图会自行加载,然后一次在一个级别上无限放大。

我最初的理论是每次地图缩放都会触发另一个 'postcompose' 事件,导致它再次缩放。我一直在尝试遵循 RenderEvents 文档,似乎 preventDefault() 或 stopPropagation() 方法可能会做我想做的,但我对 JavaScript 的理解充其量是有限的,我不确定如果我正确地实施了该方法,或者这实际上是问题所在。

https://openlayers.org/en/latest/apidoc/module-ol_render_Event-RenderEvent.html

谁能告诉我如何防止我的地图在加载时无限放大,而是只放大一次?

Use 可以使用 .once() 只监听事件的下一次发生,所以

map.once('postcompose', function(e){
  ...
});

将在第一个事件后停止并且只重新渲染一次。