在Gmap上使用OverlappingMarkerSpiderfier时如何取消页面加载时的标记

Question

当使用OverlappingMarkerSpiderfier而不是鼠标单击事件时，我希望取消对页面加载时GMAP上相同地理位置上的标记的蜘蛛识别。 原因是地图显示在没有点击事件的电视上。

下面是我工作的代码：

<script> 

    function initialize() {
  var gm=google.maps;
  var myLatlng = new google.maps.LatLng(20.5937, 78.9629);
  var mapOptions = {
    zoom: 4,
    center: myLatlng
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  var oms = new OverlappingMarkerSpiderfier(map); 
  var iw = new gm.InfoWindow();
  oms.addListener('click', function(marker, event) {
    iw.setContent(marker.desc);
    iw.open(map, marker);
  });
  oms.addListener('spiderfy', function(markers) {
    iw.close();
  });

  var locations = ["Delhi, Mumbai", "Ahemdabad","Bengluru"]

  for (var i = 0; i < locations.length; i ++) {
    var title_i = "title " + i;
    var desc_i = "desc " + i;
    var loc = new gm.LatLng(20.5937, 78.9629);
    var marker = new gm.Marker({
      position: loc,
      title: title_i,
      map: map
    });
    marker.desc = desc_i;
    oms.addMarker(marker);  
  } 
}

google.maps.event.addDomListener(window, 'load', initialize);

</script>

请帮忙！ 谢谢。

Answer 1

您可以使用重叠标记蜘蛛程序的markersNearAnyOtherMarker()函数来获取一组标记，检索数组的最后一个标记，并触发最后一个标记上的click事件，以编程方式打开您的一组标记。 代码的相关部分是

google.maps.event.addListener(map, 'idle', function(ev){
    var mm = oms.markersNearAnyOtherMarker();

    var m1 = mm.pop();
    google.maps.event.trigger(m1, 'click', {
        stop: null, 
        latLng: myLatlng
    });
});

看下面的示例并运行它

 var map; function initMap() { var gm=google.maps; var myLatlng = new google.maps.LatLng(20.5937, 78.9629); var mapOptions = { zoom: 4, center: myLatlng } var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); var oms = new OverlappingMarkerSpiderfier(map); var iw = new gm.InfoWindow(); oms.addListener('click', function(marker, event) { iw.setContent(marker.desc); iw.open(map, marker); }); oms.addListener('spiderfy', function(markers) { iw.close(); }); var locations = ["Delhi, Mumbai", "Ahemdabad","Bengluru"] for (var i = 0; i < locations.length; i ++) { var title_i = "title " + i; var desc_i = "desc " + i; var loc = new gm.LatLng(20.5937, 78.9629); var marker = new gm.Marker({ position: loc, title: title_i, map: map }); marker.desc = desc_i; oms.addMarker(marker); } google.maps.event.addListener(map, 'idle', function(ev){ var mm = oms.markersNearAnyOtherMarker(); var m1 = mm.pop(); google.maps.event.trigger(m1, 'click', { stop: null, latLng: myLatlng }); }); } 

 #map-canvas { height: 100%; } html, body { height: 100%; margin: 0; padding: 0; } 

 <div id="map-canvas"></div> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&callback=initMap" async defer></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/OverlappingMarkerSpiderfier/1.0.3/oms.min.js"></script> 

jsbin上也提供了此示例： http ://jsbin.com/sayude/edit?html，输出

我希望这有帮助！