Openlayers 适合弹跳的范围

Question

我正在尝试在两个范围之间制作动画，并在动画中间增加缩放比例，以在相距很远的位置之间创建弹跳或飞行效果。现在我正在使用 view.fit(extent, {duration: 2000})。问题是缩放在动画期间根本没有改变。当我从一个范围平移到相距很远的另一个范围时，您只会看到一堆瓷砖以非常低的缩放级别飞过。

Answer 1

对于飞行效果，您需要将一个 center 动画与两个 zoom 动画组合，并同时启动它们。您可以计算中心并根据所需范围进行缩放 (myExtent)。像

    var resolution = view.getResolutionForExtent(myExtent);
    var zoom = view.getZoomForResolution(resolution);
    var center = ol.extent.getCenter(myExtent);
    view.animate({
      center: center,
      duration: duration
    });
    view.animate({
      zoom: zoom - 1,
      duration: duration / 2
    }, {
      zoom: zoom,
      duration: duration / 2
    });

类似的东西在官方动画示例中也显示为 "Fly to Bern" (http://openlayers.org/en/latest/examples/animation.html)。

Openlayers 适合弹跳的范围

Openlayers fit extent with bounce

animation

openlayers

extent