真正顺利放大Leaflet

时间:2017-01-20 08:53:11

标签: leaflet

有几天,我一直试图找出如何让Leaflet进行流体变焦,我的意思是可以在例如OpenSeadragon中找到的那个。我一直在使用地图对象上的zoomSnapwheelDebounceTimewheelPxPerZoomLevel设置,但都无济于事。

流体变焦有一个巨大的'哇'因素,除此之外,我想使用Leaflet Draw让用户注释平铺的旧地图,用于讲故事。

有没有人成功实现过OpenSeadragon风格的缩放?与.flyTo()处理程序一样,TouchZoom方法似乎能够平滑地放大和缩小。此外,单击缩放按钮时,图像会平滑放大。但我不能为我的生活弄清楚如何在滚动事件中使用它。

有人能指出我正确的方向吗?

可以找到问题的演示here

2 个答案:

答案 0 :(得分:2)

有一个名为SmoothWheelZoom的Leaflet插件,具有部分缩放级别,在放大或缩小时具有较平滑的效果。 Leaflet's plugins page上未列出SmoothWheelZoom。

(看上去完全像OpenLayers smooth zoom。)

答案 1 :(得分:0)

传单现在具有部分缩放级别:

Leaflet 1.0.0中引入的功能是分数缩放的概念。在此之前,地图的缩放级别只能是整数(0、1、2,依此类推);但现在您可以使用小数,例如1.5或1.25。

默认情况下,小数变焦是禁用的。要启用它,请使用地图的zoomSnap选项。 zoomSnap选项的默认值为1(这意味着地图的缩放级别可以为0、1、2,依此类推)。
[...]
zoomSnap可以设置为零。这意味着Leaflet不会捕捉缩放级别。

这与智能手机上的捏缩放效果特别好,但是不像我在MapBox或OpenLayers上看到的那样反应灵敏。


See this article for a live demo with explanations