Question

当我们放大地图时，如何增加所有标记的大小？我知道我们可以使用map.on('zoomend', function() {});并更改函数内部的图标大小。但是我有很多标记并循环遍历所有标记并单独更改它们似乎不是一个好主意。

Answer 1

在每个zoomend事件中循环一组标记没有任何问题。为什么听起来不是一个好主意？

循环标记的另一种方法是扩展L.Marker类以便为您完成工作，例如：

L.Marker.Autoresizable = L.Marker.extend({

    onAdd: {
        map.on('zoomend', this._changeIcon, this);
    },

    onRemove: function(map) {
        map.off('zoomend', this._changeIcon, this);
    },

    _changeIcon: function(ev) {
        var zoom = this._map.getZoom();

        if (zoom <= 10) {
            this.setIcon(...);
        } elseif (zoom > 10 && zoom <= 15) {
            this.setIcon(...);
        } else {
            this.setIcon(...);
        }

    }

});

L.marker.autoresizable = function(latlng, options) {
    return new L.Marker.Autoresizable(latlng, options);
}

在这种情况下，Leaflet代码将隐式循环遍历zoomend事件的所有事件侦听器，这与自己循环遍历标记几乎相同（性能方面）。

Mapbox，leaflet：在Zoom上增加标记大小

1 个答案: