CODEWITHSUNDEEP
javascriptjquerygoogle-maps-api-3
Dimitri Bostrovich
Dimitri Bostrovich

Reputation: 315

Am getting error "w.getPosition is not a function" using google map API setMarkers function?

Trying to offset markers if they are on top of each other in my array of markers. I cant seem to stop the error. I am using this answer as guidance:
https://stackoverflow.com/a/25615622/13249825

Array of marker GPS coordinates and other data coming out of an ajax request in database:

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);
}        
}    
}

Markers Array

(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

Upvotes: 0

Views: 176

Answers (1)

Zackattack
Zackattack

Reputation: 316

Here you go. Keep your markerArray, but just every time you want to add new icons. Just run them through the markerArray to see if there are any duplicate lat/lng.

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);
}        
}    
}

Upvotes: 1

Related Questions