Javascript 自定义标记重叠问题

我已经在地图上显示了自定义标记。其中一些相互重叠。 为此，我创建了一个逻辑，在每次单击标记时分别显示信息窗口

以下是我的例子：

在这里您可以看到，当点击标记地图时，它正在缩放

但是，我想，当我点击重叠的标记，然后它应该是缩放，而不是在一个单独的标记点击

那么，有没有办法发现标记重叠

所以，当标记分离时，我可以停止缩放

        google.maps.event.addListener(marker, 'click', (function (marker, x, content) {
        return function () {
            var zoomLevel = map.getZoom();
            if (zoomLevel != 15)
                map.setZoom(zoomLevel + 1)

            infowindow.close();
            infowindow.setOptions({
                content: content,
                pixelOffset: new google.maps.Size(0, 20)
            })
            infowindow.open(map, this);
        }
    })(marker, x, content));

---

有一个简单的方法

---

看看OverlappingMarkerSpiderfier：如果你不想重新发明轮子……是的，我看过那个演示。但是，我不想这样。当它们重叠时，我必须放大标记单击。如果它们非常接近，即使在最大缩放级别，它们仍然重叠，该怎么办？顺便说一句。当你的一个问题得到一个好的答案时，你可以投票/接受答案。

var markerCluster = new MarkerClusterer(map, markersArray, {imagePath:'https://googlemaps.github.io/js-marker-clusterer/images/m'});

  function initialize() {
      var mapOptions = {
          zoom: 7,
          draggableCursor: 'default',
          draggingCursor: 'pointer',
          visualRefresh: true,
          scaleControl: true,
          scaleControlOptions: {
              position: google.maps.ControlPosition.TOP_CENTER
          },
          streetViewControl: false,
          maxZoom: 17,
          minZoom: 4,
          center: new google.maps.LatLng(40.73761121, -73.8186132),
      };
      map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

      var infowindow = new google.maps.InfoWindow();

      var color = ['red', 'blue', 'yellow','pink', 'black','green','pink','gray','red', 'blue', 'yellow', 'black', 'gray'];

      var markerA = [
          ['BQ04998A_A', '-73.8186132', '40.73761121', '30'],
          ['BQ04280A_B', '-73.97947631', '40.64278852', '130'],
          ['BQ04673A_B', '-73.90797053', '40.63474517', '150'],
          ['LI12404B_A', '-73.72630945', '40.65964026', '30'],
          ['BQ04401A_C', '-73.78156774', '40.6451916', '250'],
          ['BQ06011B_B','-73.79849804','40.66775732','145'],
          ['BQ06176B_B','-73.86074985','40.75626901','140'],
          ['LI12869A_B','-73.59015092','40.6796578','150'],
          ['LI13123C_C','-73.1161812','40.90960403','303'],
          ['NY01114B_A','-73.99099681','40.75596539','340'],
          ['BQ04567E_A','-73.82849995','40.75500521','30'],
          ['LI12031A_A','-73.70109864','40.75319817','30'], 
          ['LI12089B_A','-73.58183184','40.65620728','60'],
          ['BQ04072F_C','-73.8900656','40.7466413','290'],
          ['BQ04113A_B','-73.8933153','40.68161187','150']
      ];
      var marker;
      var mkrs = [];
      for (var i = 0; i < markerA.length; i++) {

          marker = new google.maps.Marker({
              position: new google.maps.LatLng(markerA[i][2], markerA[i][1]),
              map: map,
              icon: {
                  path: 'm 32.460621,0.112468 -32.372233,-0.022 0,-0.088 L 0,0.090468 l 22.91468,22.9147 c 0.02205,-0.022 0.04437,-0.044 0.06629,-0.066 6.300656,-6.3007 9.451842,-14.5699 9.47965,-22.8263 z',

                  fillColor: color[i],
                  fillOpacity: 1,
                  strokeColor: '',
                  strokeWeight: 0,
                  rotation: 280 + markerA[i][3],
                  anchor: new google.maps.Point(0, 0)
              }
          });

          mkrs.push(marker);


          google.maps.event.addListener(marker, 'click', (function (marker, i, content) {
              return function () {
                 var zoomLevel = map.getZoom();
            if (zoomLevel != 15)
                map.setZoom(zoomLevel + 1)

            infowindow.close();
            infowindow.setOptions({
                content: content,
                pixelOffset: new google.maps.Size(0, 20)
            })
            infowindow.open(map, this);
              }
          })(marker, i, content));
      }

            var markerCluster = new MarkerClusterer(map, mkrs, {imagePath: 'https://googlemaps.github.io/js-marker-clusterer/images/m'});
       var content = markerA[i][0];
  }



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