Angular 6 从 google 地图中删除所有标记

Question

<div #gmap class="map"></div>

for (let marker of this.markersDisplay) {
          let markerColor = (marker.MarkerType == MarkerType.Ok) ? "green" : (marker.MarkerType == MarkerType.Warning) ? "yellow" : "red";
          let markerClick = new google.maps.Marker(
            {
              position: new google.maps.LatLng(marker.Latitude, marker.Longitude),
              map: this.map,
              title: marker.Title,
              visible: marker.Visible,
              clickable: marker.Clickable,
              icon: 'http://maps.google.com/mapfiles/ms/icons/' + markerColor + '-dot.png',
            });
          markerClick.addListener('click', () => { this.MarkerClick(marker); });
        }
      }

我需要过滤地图上的标记。在添加新标记之前，我想清除地图上的所有标记。怎么做？

Answer 1

你可以在标记上尝试运行 foreach 然后设置 :

marker.setMap(null);
marker = null;

Answer 2

如何一次全部删除？

你不能。将每个 Marker 对象推送到一个数组：

// Create empty markers array    
var markers = [];

for (let marker of this.markersDisplay) {
  let markerColor = (marker.MarkerType == MarkerType.Ok) ? "green" : (marker.MarkerType == MarkerType.Warning) ? "yellow" : "red";
  let markerClick = new google.maps.Marker({
    position: new google.maps.LatLng(marker.Latitude, marker.Longitude),
    map: this.map,
    title: marker.Title,
    visible: marker.Visible,
    clickable: marker.Clickable,
    icon: 'http://maps.google.com/mapfiles/ms/icons/' + markerColor + '-dot.png',
  });
  markerClick.addListener('click', () => {
    this.MarkerClick(marker);
  });

  // Push marker to markers array
  markers.push(markerClick);
}

稍后当您想要将它们全部删除时，遍历数组并在每个标记上调用 setMap(null)：

for (var i=0; i<markers.length; i++) {

  markers[i].setMap(null);
}

Angular 6 从 google 地图中删除所有标记

Angular 6 Remove all markers from google map

javascript

google-maps-api-3

google-maps-markers

angular