OL3 中的分数缩放（平滑缩放）答案

【问题标题】：Fractional zoom (smooth zoom) in OL3OL3 中的分数缩放（平滑缩放）
【发布时间】：2016-10-04 10:53:59
【问题描述】：

我想将我的Web-Mapping-Application 从OL2 升级到OL3，但现在我被平滑缩放的问题阻止了。在OL2 中，我使用了map.fractionalZoom 功能，因为我的应用程序使用单个Tile WMS，并且我必须使用滑块或ZoomBox（OL3 中的DragZoom）精确缩放到任何比例。

谁能帮助我并展示如何在 OL3 中获得相同的功能？

来自德国的感谢和问候

叶夫根尼·T.

【问题讨论】：

标签： javascript openlayers-3 wms

【解决方案1】：

OpenLayers 3 以相反的方式工作：它支持开箱即用的任何分数缩放级别，但它的控件和交互将它们设置的缩放限制为整数缩放级别。这意味着您可以通过编程设置分数缩放级别：

map.getView().setZoom(9.3);
map.getView().fit(extent, size, {constrainResolution: false});

这也意味着您可以创建不将缩放级别限制为整数的自定义控件和交互。例如，如果您希望将视图与您使用 ol.interaction.DragBox 创建的精确范围相匹配，您的自定义缩放框交互可能如下所示：

var zoomBox = new ol.interaction.DragBox();
zoomBox.on('boxend', function() {
  map.getView().fit(zoomBox.getGeometry(), map.getSize(),
      {constrainResolution: false});
});

更新：最近的 OpenLayers 版本（v3.20.0 及更高版本）在使用滚轮或双指缩放时不再限制缩放级别。

【讨论】：

非常感谢！有用。 :) 使用 zoomBox.getGeometry() 进行放大非常简单。但只是缩小需要对 zoomBox 几何进行更多的数学运算。
这里有一个高级解决方案，包括放大、缩小和一些最小框尺寸、边框等的例外。 jsfiddle.net/nkytma7k