传单 L.Icon 标记未在地图重新加载时移除
Leaflet L.Icon marker not removing on Map reload
地图包含两种类型的标记
圆形图标添加者:
let circle = new customCircleMarker([item.latitude, item.longitude], {
color: '#2196F3',
fillColor: '#2196F3',
fillOpacity: 0.8,
radius: radM,
addressId: item.address_id
}).bindTooltip(`Address: <b>${item.address}</b><br/>
Patients from this address: <b>${item.total_patients}</b><br/>
Production: <b>$${item.total_production}</b><br/>`)
.addTo(this.mapInstance).on('click', this.circleClick);
通过以下方法添加图标标记:
// 创建标记对象,将自定义图标作为选项传递,将内容和选项传递给弹出窗口,添加到地图
// create marker object, pass custom icon as option, pass content and options to popup, add to map
L.marker([item.latitude, item.longitude], { icon: chartIcon })
.bindTooltip(`Address: <b>${item.address}</b><br/>
Patients from this address: <b>${item.total_patients}</b><br/>
Production: <b>$${item.total_production}</b><br/>`)
.addTo(this.mapInstance).on('click', this.circleClick);
在清除地图时图标标记未被移除
地图清除功能:
if (this.mapInstance) {
for (let i in this.mapInstance._layers) {
if (this.mapInstance._layers[i]._path !== undefined) {
try {
this.mapInstance.removeLayer(this.mapInstance._layers[i]);
} catch (e) {
console.log('problem with ' + e + this.mapInstance._layers[i]);
}
}
}
}
您在删除之前正在检查 _path
属性。它将跳过 L.Marker
层,因为它们没有 _path
属性,只有矢量图层(从 L.Path 扩展)有。
如果您只需要从地图中删除某些图层类型,最好将它们分组到分组图层中,例如 L.LayerGroup
或 L.FeatureGroup
,然后使用它们的 clearLayers
方法:
var layerGroup = new L.LayerGroup([
new L.Marker(...),
new L.CircleMarker()
]).addTo(map);
layerGroup.clearLayers();
如果这不是一个选项,您可以迭代地图的图层,然后检查图层的实例:
function customClearLayers () {
map.eachLayer(function (layer) {
if (layer instanceof L.Marker || layer instanceof L.CircleMarker) {
map.removeLayer(layer);
}
});
}
地图包含两种类型的标记 圆形图标添加者:
let circle = new customCircleMarker([item.latitude, item.longitude], {
color: '#2196F3',
fillColor: '#2196F3',
fillOpacity: 0.8,
radius: radM,
addressId: item.address_id
}).bindTooltip(`Address: <b>${item.address}</b><br/>
Patients from this address: <b>${item.total_patients}</b><br/>
Production: <b>$${item.total_production}</b><br/>`)
.addTo(this.mapInstance).on('click', this.circleClick);
通过以下方法添加图标标记:
// 创建标记对象,将自定义图标作为选项传递,将内容和选项传递给弹出窗口,添加到地图
// create marker object, pass custom icon as option, pass content and options to popup, add to map
L.marker([item.latitude, item.longitude], { icon: chartIcon })
.bindTooltip(`Address: <b>${item.address}</b><br/>
Patients from this address: <b>${item.total_patients}</b><br/>
Production: <b>$${item.total_production}</b><br/>`)
.addTo(this.mapInstance).on('click', this.circleClick);
在清除地图时图标标记未被移除
地图清除功能:
if (this.mapInstance) {
for (let i in this.mapInstance._layers) {
if (this.mapInstance._layers[i]._path !== undefined) {
try {
this.mapInstance.removeLayer(this.mapInstance._layers[i]);
} catch (e) {
console.log('problem with ' + e + this.mapInstance._layers[i]);
}
}
}
}
您在删除之前正在检查 _path
属性。它将跳过 L.Marker
层,因为它们没有 _path
属性,只有矢量图层(从 L.Path 扩展)有。
如果您只需要从地图中删除某些图层类型,最好将它们分组到分组图层中,例如 L.LayerGroup
或 L.FeatureGroup
,然后使用它们的 clearLayers
方法:
var layerGroup = new L.LayerGroup([
new L.Marker(...),
new L.CircleMarker()
]).addTo(map);
layerGroup.clearLayers();
如果这不是一个选项,您可以迭代地图的图层,然后检查图层的实例:
function customClearLayers () {
map.eachLayer(function (layer) {
if (layer instanceof L.Marker || layer instanceof L.CircleMarker) {
map.removeLayer(layer);
}
});
}