javascript - 传单中的圆形标记标签

Question

我可以像这样给 circlemarker 添加标签

L.circleMarker(points[i],{title: 'unselected'}).bindLabel('Destination').addTo(map);

这会添加鼠标悬停在圆形标记上时出现的标签。

但我想添加静态标签，无论鼠标是否位于该圆圈标记上，该标签都会出现。

我指的是这个演示 http://leaflet.github.com/Leaflet.label/用于向圆形标记添加静态标签，但有些我无法做到这一点。它与标记一起工作正常，但与圆形标记静态标签不起作用。

还有没有其他方法可以在圆形标记上添加标签？

Answer 1

L.CircleMarker 从 L.Path 而不是 L.Marker 扩展，所以如果你比较 https://github.com/Leaflet/Leaflet.label/blob/master/src/Path.Label.js和 https://github.com/Leaflet/Leaflet.label/blob/master/src/Marker.Label.js你会发现 Path 没有任何选项，这个逻辑你必须自己实现。例如:

L.CircleMarker.include({
    bindLabel: function (content, options) {
        if (!this._label || this._label.options !== options) {
            this._label = new L.Label(options, this);
        }

        this._label.setContent(content);
        this._labelNoHide = options && options.noHide;

        if (!this._showLabelAdded) {
            if (this._labelNoHide) {
                this
                    .on('remove', this.hideLabel, this)
                    .on('move', this._moveLabel, this);
                this._showLabel({latlng: this.getLatLng()});
            } else {
                this
                    .on('mouseover', this._showLabel, this)
                    .on('mousemove', this._moveLabel, this)
                    .on('mouseout remove', this._hideLabel, this);
                if (L.Browser.touch) {
                    this.on('click', this._showLabel, this);
                }
            }
            this._showLabelAdded = true;
        }

        return this;
    },

    unbindLabel: function () {
        if (this._label) {
            this._hideLabel();
            this._label = null;
            this._showLabelAdded = false;
            if (this._labelNoHide) {
                this
                    .off('remove', this._hideLabel, this)
                    .off('move', this._moveLabel, this);
            } else {
                this
                    .off('mouseover', this._showLabel, this)
                    .off('mousemove', this._moveLabel, this)
                    .off('mouseout remove', this._hideLabel, this);
            }
        }
        return this;
    }
});

L.circleMarker([53.902257, 27.541640] ,{title: 'unselected'}).addTo(map).bindLabel('Destination', { noHide: true });