javascript - 使用 google map API setMarkers 函数时出现错误 "w.getPosition is not a function"？

Question

如果标记在我的标记数组中彼此重叠，则尝试偏移标记。我似乎无法阻止错误。我使用这个答案作为指导:
https://stackoverflow.com/a/25615622/13249825

数据库中来自 ajax 请求的标记 GPS 坐标和其他数据的数组:

var markers = (response['markers']);

var markerArray = []; //Marker array I use to store Marker data so I can delete/add later.
function setMarkers(markers) {
var iconBase =
            '/local/';
var icons = {
         'Automotive Care': {
            image: iconBase + 'AC.png',  
          },
          Contractor: {
            image: iconBase + 'contractor.png',
          }
        };
var infowindow = new google.maps.InfoWindow();
    if (markers){
  for (let i = 0; i < markers.length; i++) {
    var w = markers[i];
    var pos = w.getPosition();
    var latLng = new google.maps.LatLng(parseFloat(w[1]),parseFloat(w[2])); 

    if (latLng.equals(pos)) {
    var a = 360.0 / markers.length;
    var newlat = pos.lat() + -.00004 * Math.cos((+a*i) / 180 * Math.PI);  //x
    var newlng = pos.lng() + -.00004 * Math.sin((+a*i) / 180 * Math.PI);  //Y
    var latLng = new google.maps.LatLng(newLat,newLng);    
}
    var marker = new google.maps.Marker({
      position: latLng,
      map: map,
      icon: {url: icons[w[4]].image,
            scaledSize: new google.maps.Size(32, 32)},
      title: w[0],
      zIndex: parseFloat(w[3])
    });
      markerArray.push(marker);
}        
}    
}

标记数组

(4) [Array(9), Array(9), Array(9), Array(9)]
0: (9) ["aawefwaef", "43.033320", "-76.053556", "3", "Automotive Care", "234", "Anytime", "Anytime", 163]
1: (9) ["sdfg", "43.028406", "-76.000523", "3", "Pet Care", "345", "Anytime", "Anytime", 159]
2: (9) ["asd", "43.028406", "-76.000523", "3", "Contractor", "111", "Anytime", "Anytime", 151]
3: (9) ["qwe", "43.028406", "-76.000523", "3", "Automotive Care", "123", "Anytime", "Anytime", 150]
length: 4

Answer 1

给你。保留您的markerArray，但只是每次您想要添加新图标时。只需通过markerArray 运行它们，看看是否有重复的纬度/经度。

var markerArray = []; //Marker array I use to store Marker data so I can delete/add later.
function setMarkers(markers) {
var iconBase =
            '/local/';
var icons = {
         'Automotive Care': {
            image: iconBase + 'AC.png',  
          },
          Contractor: {
            image: iconBase + 'contractor.png',
          }
        };
var infowindow = new google.maps.InfoWindow();
    if (markers){
  for (var i = 0; i < markers.length; i++) {
    var w = markers[i]; 
    var latLng = new google.maps.LatLng(parseFloat(w[1]),parseFloat(w[2])); 


if(markerArray.length != 0) {
    for (let i=0; i < markerArray.length; i++) {
        var existingMarker = markerArray[i];
        var pos = existingMarker.getPosition();
        if (latLng.equals(pos)) {
            var a = 360.0 / markerArray.length;
            var newLat = pos.lat() + -.00004 * Math.cos((+a*i) / 180 * Math.PI);  //x
            var newLng = pos.lng() + -.00004 * Math.sin((+a*i) / 180 * Math.PI);  //Y
            var latLng = new google.maps.LatLng(newLat,newLng);
        }
    }
}
    var marker = new google.maps.Marker({
      position: latLng,
      map: map,
      icon: {url: icons[w[4]].image,
            scaledSize: new google.maps.Size(32, 32)},
      title: w[0],
      zIndex: parseFloat(w[3])
    });
      markerArray.push(marker);
}        
}    
}