Question

我使用OpenLayers3创建了一个地图。我可以使用以下代码成功缩放到地图上的图层：

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

然而，我想以动画的方式喜欢类似的东西。

我知道以下动画：

ol.animation.pan
ol.animation.zoom

通过使用这些我无法缩放到图层，使用ol.animation.pan我只能平移到一个点（而不是一个边界框）并使用ol.animation.zoom我可以缩放到一个分辨率（和不到边界框）。所以我正在寻找的是一个动画.fit，所以我可以缩放动画到一定程度。

关于如何实现这一目标的任何建议都将受到赞赏：）

Answer 1

从v3.20.0开始，OpenLayers在duration上有一个新的ol.View#fit()选项。要将1秒动画设置为适合范围，请将其设置为1000：

// OpenLayers v3.20.x
view.fit(extent, size, {duration: 1000});

另请注意，从v3.21.0开始，ol.View#fit()的API已经过简化 - 不再需要设置大小（除非页面上有多个地图）：

// OpenLayers >= v3.21.0
view.fit(extent, {duration: 1000});

Answer 2

我刚刚解决了这个问题

var view = map.getView()
var pan = ol.animation.pan({ source: view.getCenter() });
var zoom = ol.animation.zoom({ resolution: view.getResolution() });
map.beforeRender(pan, zoom);
view.fit(extent, map.getSize())

OpenLayers3 - 特定范围内的动画.fit

2 个答案: