删除所有显示的标记 Google API

Question

我在 Laravel 项目中工作，如果我只选择 1 个商店，我有一个用于在 Google 地图上显示和删除所有商店的模块。

这是一个重复的问题，但是，为什么我的函数无法将函数 showallmarks 设置为 null。

问题：点击按钮后如何删除谷歌地图中显示的所有标记？

我这里有代码。

显示所有标记：

showallmarks();

function showallmarks() {
  $.each(locations, function(index, value) {

    var position = new google.maps.LatLng(value.store_lat, value.store_long);
    var title = value.branch_name;
    var address = value.store_address;

    var contentString = "<h5>" + title + "</h5>" + address;

    var infowindow = new google.maps.InfoWindow({
      content: contentString
    });

    var marker = new google.maps.Marker({
      position: position,
      icon: google.maps.marker,
      map: map,
      zoom: 12
    });

    marker.addListener('click', function() {
      infowindow.open(map, marker);
    });
  });
}

点击此按钮后，showallmarks 不得显示在 Google 地图上。

var markeronce;

$('button#addresses').click(function() {

  //removing all marks 
  showallmarks(null);

  var infowindow = new google.maps.InfoWindow({
    content: "<span>Visit us on our store.</span>"
  });
  var address_href = $(this).val();
  var commaPos = address_href.indexOf(',');
  var coordinatesLat = parseFloat(address_href.substring(0, commaPos));
  var coordinatesLong = parseFloat(address_href.substring(commaPos + 1, address_href.length));

  var centerPoint = new google.maps.LatLng(coordinatesLat, coordinatesLong);


  if (!markeronce) {
    markeronce = new google.maps.Marker({
      position: centerPoint,
      map: map,
      zoom: 8
    });
  } else {
    markeronce.setPosition(centerPoint);
  }
  map.setCenter(centerPoint);
})

Answer 1

添加按钮喜欢

  <input type="button" value="Delete" onclick="DeleteMarkers()" />

试试这个功能

    <script type="text/javascript">
    var markers = [];

    function DeleteMarkers() {
            //Loop through all the markers and remove
            for (var i = 0; i < markers.length; i++) {
                markers[i].setMap(null);
            }
            markers = [];
        };
    </script>