小叶不能清除层和标记



我想从地图中删除所有标记,并尝试使用map.remove

删除标记我使用vue.js与传单显示地图我有一个对象来记录LNG和late

router_planning: [
{
car: [
{
name: "001",
lat: 25.042474,
lng: 121.513729,
},
{
name: "002",
lat: 24.982474,
lng: 121.613729,
},
{
name: "003",
lat: 24.894474,
lng: 121.623729,
},
],
},
{
car: [
{
name: "004",
lat: 24.982474,
lng: 121.513729,
},
{
name: "005",
lat: 24.882474,
lng: 121.513729,
},
{
name: "006",
lat: 24.982474,
lng: 121.713729,
},
],
},
],

和下面的两个函数Initmap()//设置视图

initmap() {
this.mapp = L.map("map");
this.mapp.setView(
[
this.router_planning[0].car[0].lat,
this.router_planning[0].car[0].lng,
],
10
); 
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
maxZoom: 13, 
minZoom: 9,
}).addTo(this.mapp);
},

make_map()//给出映射标记

make_map() {
for (let i = 0; i < this.router_planning.length; i++) {
for (let j = 0; j < this.router_planning[i].car.length; j++) {
L.circleMarker(
[
this.router_planning[i].car[j].lat,
this.router_planning[i].car[j].lng,
],
{
color: this.circle_marker[i],
fillColor: this.circle_marker[i],
fillOpacity: 1,
radius: (i + 1) ** 2,
}
)
.addTo(this.mapp)
.bindTooltip(this.router_planning[i].car[j].name.toString(), {
permanent: true,
});

}
},

我的网页应该这样工作首先initmap(),然后make_map()

我有一个按钮来触发make_map()改变lat和lng

但旧标记没有消失

i have try add

this.mapp.remove()到make_map()的顶部
i got error message

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'appendChild')

我已经尝试将这个添加到make_map的顶部,没有错误

但没有清除标记

var container = L.DomUtil.get('map');
container._leaflet_id = null;

我看了很多文章来清除地图,但仍然没有工作我真想知道为什么不能清除或删除map

谢谢

要从地图上删除所有标记,您必须首先将它们存储在某个地方。
你可以将所有的标记存储在一个数组中:

const markers = [];
const marker = L.circleMarker([...])
.bindTooltip([...])
.addTo(map);
markers.push(marker);

要删除它们,你需要调用:

for(let i = 0; i < markers.length; i++) {
map.removeLayer(marker[i]);
}

示例: 如果你不需要删除特定的标记,有一个更好的方法来做到这一点,使用LayerGroup()
const layerGroup = new L.LayerGroup();
const marker = new L.marker([...]).addTo(layerGroup);
//after you've added all markers to layerGroup():
map.addLayer(layerGroup)

和删除所有标记只需调用:map.removeLayer(layerGroup)

相关内容

  • 没有找到相关文章

最新更新