gpt4 book ai didi

leaflet - 扩展传单标记时出现弹出窗口问题

转载 作者:行者123 更新时间:2023-12-02 14:23:48 24 4
gpt4 key购买 nike

我正在尝试扩展传单标记类来创建位置标记。我的位置标记由代表用户位置的内圆和代表用户位置准确性的外圆组成。我正在扩展该类,因为我想显示很多用户的位置,并且不想为每个用户创建 2 个标记。

不过,我在弹出窗口工作时遇到问题。两件事:

  1. 弹出窗口不起作用,即永远不会显示。
  2. 我可以将弹出窗口仅绑定(bind)到内圈(用户位置),而不绑定(bind)到外圈(准确性)

这是一个小块,蓝色标记是带有弹出窗口的标准圆圈,绿色是我的扩展标记,弹出窗口不起作用。 http://plnkr.co/edit/5tz538?p=preview

代码:

L.LocationMarker = L.Marker.extend({
initialize: function (latlng, options) {
L.Marker.prototype.initialize.call(this, latlng);

this._accuracyCircle = L.circle(latlng, 0, {
color: options.color,
fillColor: options.color,
fillOpacity: 0.15,
weight: 2,
opacity: 0.5
});

this._locationMarker = L.circleMarker(latlng, {
color: options.color,
fillColor: options.color,
fillOpacity: 0.7,
weight: 2,
opacity: 0.9,
radius: 5
});

this._location = L.layerGroup([this._accuracyCircle, this._locationMarker]);
},

addTo: function (map) {
map.addLayer(this._location);
return this;
},

onAdd: function (map) {
this._map = map;
map.addLayer(this._location);
},

onRemove: function (map) {
map.removeLayer(this._location);
},

getLatLng: function() {
return this._locationMarker.getLatLng();
},

setLatLng: function (latlng) {
this._accuracyCircle.setLatLng(latlng);
this._locationMarker.setLatLng(latlng);
return this;
},

setAccuracy: function (accuracy) {
this._accuracyCircle.setRadius(accuracy ? accuracy : 0);
return this;
}
});

L.locationMarker = function (latlng, options) {
return new L.LocationMarker(latlng, options);
};

最佳答案

明白了。我必须重写弹出方法才能仅处理 locationMarker。

bindPopup: function (content, options) {
this._locationMarker.bindPopup(content, options);
return this;
},

setPopupContent: function (content) {
this._locationMarker.setPopupContent(content);
return this;
},

unbindPopup: function () {
this._locationMarker.unbindPopup();
return this;
},

_movePopup: function (e) {
this._locationMarker.setLatLng(e.latlng);
}

笨蛋: http://plnkr.co/edit/5tz538?p=preview

关于leaflet - 扩展传单标记时出现弹出窗口问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18168635/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com