如何在 OpenLayers 4 中按比例缩放？答案

【问题标题】：How zoom base on scale in OpenLayers 4?如何在 OpenLayers 4 中按比例缩放？
【发布时间】：2018-06-20 13:37:53
【问题描述】：

我想根据比例缩放到 ol3 地图（例如 1:50000）。这意味着ol地图中的每1cm必须在现实世界中显示50000cm。为了将比例转换为分辨率，我使用如下：

var getResolutionFromScale = function(scale, units) {
    var dpi = getDpi();
    var mpu = ol.proj.METERS_PER_UNIT[units];
    var inchesPerMeter = 39.37;
    return parseFloat(scale) / (mpu * inchesPerMeter * dpi);
}

function getDPI()
{
    var div = document.createElement("div");
    div.style.width="1in";
    var body = document.getElementsByTagName("body")[0];
    body.appendChild(div);
    var dpi = document.defaultView.getComputedStyle(div, null).getPropertyValue('width');
    body.removeChild(div);
    return parseFloat(dpi);
}

现在进行测试，我使用ScaleLine，当scaleLine控件显示1000m时，它的长度必须是2cm，但它几乎是2.5cm。

问题出在哪里？如何按比例缩放？

Online Demo

【问题讨论】：

标签： javascript scale openlayers dpi

【解决方案1】：

投影是一个Mercator projection，它保留角度但不保留距离。这意味着整个地图上的比例不一样:(

要查看它，只需从赤道移动到极点，然后查看 ScaleLine 长度的增长。

因此您无法计算全球范围内的比例，您必须在本地计算（计算地图投影中视图中心的 2 个点与haversine distance 之间的距离以获得比率）。请注意，DPI 取决于您使用的设备（屏幕、打印机），并且可能会因设备而异。

您可以使用geometry.getLength() 和ol.Sphere.getLength() 来计算这两个距离。看ol例子：https://openlayers.org/en/latest/examples/measure.html

【讨论】：