时间戳

首页 > 解决方案 > 在非地理地图中编辑比例尺

leaflet - 在非地理地图中编辑比例尺

问题描述

我正在使用 Leaflet 中的非地理地图。由于坐标是笛卡尔坐标，没有地理参考，因此默认情况下不应m如下所示（我已禁用比例尺中的英制单位）：

在此处输入图像描述

是否有任何解决方案可以在比例尺中转换100 m，100甚至m用其他东西替换？

标签： leaflet

解决方案

您想了解Leaflet 中的这段代码L.Control.Scale：

_updateMetric: function (maxMeters) {
    var meters = this._getRoundNum(maxMeters),
        label = meters < 1000 ? meters + ' m' : (meters / 1000) + ' km';

    this._updateScale(this._mScale, label, meters / maxMeters);
},

现在，要改变这种行为，有一种丑陋的hacky方式和一种更清洁的方式。

hacky 方法是_updateMetric从原型或实例中替换 (private, undocumented) 方法L.Control.Scale，例如：

L.Control.Scale.prototype._updateMetric = function (maxMeters) {
    var meters = this._getRoundNum(maxMeters),
        label = meters + ' units';

    this._updateScale(this._mScale, label, meters / maxMeters);
};
var myScaleControl = L.control.scale().addTo(map);

或者

var myScaleControl = L.control.scale();
myScaleControl._updateMetric = function (maxMeters) {
    var meters = this._getRoundNum(maxMeters),
        label = meters + ' units';

    this._updateScale(this._mScale, label, meters / maxMeters);
};
myScaleControl.addTo(map);

替换未记录的内部方法通常被视为一种肮脏的黑客行为，并可能导致混乱。以我的经验，诺贝尔程序员倾向于在不了解 JS 原型继承如何工作的情况下相信 hack。

“更干净”的方法是阅读Leaflet 的关于子类化控件的教程，然后创建一个子类L.Control.Scale，例如：

L.Control.MeterlessScale = L.Control.Scale.extend({
    _updateMetric: function (maxMeters) {
        var meters = this._getRoundNum(maxMeters),
            label = meters + ' units';

        this._updateScale(this._mScale, label, meters / maxMeters);
    }
});

var scale = (new L.Control.MeterlessScale()).addTo(map);

不应该害怕阅读 Leaflet 的源代码。同时，请阅读 JS 原型继承并阅读 Leaflet 自己的教程，然后再开始阅读。

假设distance的方法返回以米L.CRS为单位的距离也是正确的，并且不能通知任何调用者该 CRS 的单位；因此，假设距离以米为单位。从架构上讲，没有简单的方法可以根据 CRS 抽象距离单位（不幸的是）。L.Control.Scale

推荐阅读