9

我可以像这样向圆形标记添加标签

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

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

但我想添加静态标签，无论鼠标是否在那个圆圈标记上，它都会出现。

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

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

4

2 回答 2

12

L.CircleMarkerL.Path从not扩展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 });
于 2013-03-21T12:54:59.607 回答
1

只是想为 tbicr 的出色响应添加更新或更正（不确定 API 是否在他的响应后更新）。

你可以这样做：

 // First add your GeoJSON layer
 geojson = L.geoJson(myGeoJson,{
        onEachFeature: onEachFeature
    }).addTo(map);

 // onEachFeature is called every time a polygon is added
 var polys = [];
 function onEachFeature(layer){
     polys.push(layer); // Push the polygons into an array you can call later
 }

 // Now trigger them after they've been added
 $('a').click(function(){
      polys[0].fire('click') // clicks on the first polygon
      polys[1].fire('click') // clicks on the second polygon
 });
于 2013-03-26T18:55:32.270 回答