OpenLayers 动画 getView().fit()

Question

我一直在研究 openlayers 的动画功能，我可以看到使用

缩放到给定点和分辨率是多么简单

view.animate({
    center: position,
    zoom: 11
});

但我不知道如何制作动画

map.getView().fit(extent, map.getSize());

谁能给我一些指点？

提前致谢

Answer 1

fit 函数在 Openlayers 3 中确实支持动画。第三个参数是一个对象，可以设置不同的选项（持续时间、缓动...），您可以轻松做到：

map.getView().fit(extent, map.getSize(), { duration: 1000 });

您可以查看 Openlayers 3 API 以了解有关选项参数的更多详细信息。

我还创建了一个 jsFiddle example，您可以在其中看到它的工作原理。

小心！ OpenLayers v4.0.1 在这里：

随着最近发布的Openlayers版本，与此方法相关的一些事情发生了变化，所以如果你阅读最新Openlayers API中fit函数的文档，你会发现现在只允许使用2个参数，因为大小不需要作为参数传递（但是，它可以在选项参数中分配）。因此，您的适用于 Openlayers v4.0.1 的示例如下所示：

map.getView().fit(extent, { duration: 1000 });

牢记这些变化很重要，因为它会在您使用官方 API.

时带来混淆

OpenLayers 动画 getView().fit()

OpenLayers animate getView().fit()

javascript

openlayers

openlayers-3