如何在添加新标记和图层之前清除所有标记和图层的传单地图
How to clear Leaflet map of all markers and layers before adding new ones?
我有以下代码:
map: function (events) {
var arrayOfLatLngs = [];
var _this = this;
// setup a marker group
var markers = L.markerClusterGroup();
events.forEach(function (event) {
// setup the bounds
arrayOfLatLngs.push(event.location);
// create the marker
var marker = L.marker([event.location.lat, event.location.lng]);
marker.bindPopup(View(event));
// add marker
markers.addLayer(marker);
});
// add the group to the map
// for more see https://github.com/Leaflet/Leaflet.markercluster
this.map.addLayer(markers);
var bounds = new L.LatLngBounds(arrayOfLatLngs);
this.map.fitBounds(bounds);
this.map.invalidateSize();
}
我最初调用这个函数,它会将所有events
添加到带有标记和簇的映射中。
稍后,我通过一些其他事件,地图会放大到新事件,但旧事件仍在地图上。
我尝试过this.map.removeLayer(markers);
和其他一些东西,但我无法让旧的标记消失
如果要删除组中的所有当前层(标记),可以使用L.markerClusterGroup()
的clearLayers
方法。您的参考号为markers
,因此您需要致电:
markers.clearLayers();
您正在丢失标记引用,因为它是用var设置的。请尝试保存对"this"的引用。
mapMarkers: [],
map: function (events) {
[...]
events.forEach(function (event) {
[...]
// create the marker
var marker = L.marker([event.location.lat, event.location.lng]);
[...]
// Add marker to this.mapMarker for future reference
this.mapMarkers.push(marker);
});
[...]
}
然后稍后当您需要删除标记时运行:
for(var i = 0; i < this.mapMarkers.length; i++){
this.map.removeLayer(this.mapMarkers[i]);
}
或者,您可以将集群保存到"this",而不是保存对每个标记的每个引用。
map._panes.markerPane.remove();
$(".leaflet-marker-icon").remove();
$(".leaflet-popup").remove();
您可以清除所有标记并保存
map.eachLayer((layer) => {
layer.remove();
});
来自https://leafletjs.com/reference-1.0.3.html#map-事件
我在这里使用了beije和Prayitno Ashuri的两个最佳答案的组合。
将标记保存到"this",以便我们以后可以引用它。
this.marker = L.marker([event.location.lat, event.location.lng]);
然后移除标记。
this.markers.remove()
相关文章:
- 谷歌地图热图图层点半径
- 谷歌地图-更改图层图标大小
- 开放图层导出为 KML 并保留我的地图样式
- 传单问题:使折线的图层组不可单击
- 如何在添加新标记和图层之前清除所有标记和图层的传单地图
- 在谷歌地图HTML中简单地添加KML图层
- 谷歌地图区域中的自定义叠加层单击然后放大
- OpenLayers:自动将 EPSG 4326 - 文本图层的坐标转换为地图的投影 (EPSG:900913)
- 在鼠标单击时添加标记并删除打开图层中现有的标记
- 如何重新加载谷歌地图图层
- 清除谷歌地图图层时遇到问题
- 如何在谷歌地图中显示和忽略KML图层
- 单击另一个用于显示/隐藏图层的按钮时,在Adobe PDF中隐藏/显示按钮的代码是什么
- 嵌入融合表图层向导地图
- 谷歌地图 API - 融合表图层示例 - 地图未显示
- 如何使用 OpenLayers 在地图顶部创建可单击的格网图层
- 请求 URI 太大(融合表图层 Google 地图)
- 保留 Google 地图在复选框单击时缩放到 kml 图层
- 单击地图(GeoServer 图层)时会显示多个信息框
- 如何下载带有图层的地图的传单图像