OpenLayers为getView().fit()设置动画 [英] OpenLayers animate getView().fit()

问题描述

我一直在研究openlayers的动画功能，可以看到使用缩放到给定的点和分辨率有多么简单

I've been looking at the animation features of openlayers and I can see how simple it is to zoom to a given point and resolution using

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

但是我不知道如何制作动画

but what I can't figure out is how to animate

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

有人可以给我一些指示吗?

Can anybody give me some pointers?

预先感谢

推荐答案

fit函数确实支持Openlayers 3中的动画.第三个参数是一个对象，可以在其中设置不同的选项(持续时间，缓动...)，并且可以轻松做到:

The fit function does support animations in Openlayers 3. The third parameter is an object where different options (duration, easing...) can be set, and you can do it easily:

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

您可以查看 Openlayers 3 API 查看有关options参数的更多详细信息.

You can take a look at the Openlayers 3 API to see more details about the options parameter.

我还创建了一个 jsFiddle示例，您可以看到它的工作原理.

I have also created a jsFiddle example where you can see this working.

小心！ OpenLayers v4.0.1在这里:

在最近发布的Openlayers版本中，与该方法有关的某些内容已更改，因此，如果您阅读最新的

With the recently released version of Openlayers, some things related to this method were changed, so if you read the documentation for the fit function in the latest Openlayers API you will find that only 2 parameters are allowed now, since the size does not need to be passed as parameter (However, it can be assigned in the options parameter). So your example adapted to Openlayers v4.0.1 would be like follows:

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

请务必牢记这些更改，因为在您使用官方API时可能引起混淆.

It's important to keep these changes in mind because it can bring confussion while you use the official API.

这篇关于OpenLayers为getView().fit()设置动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！