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

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())