Éléments de tableau Javascript == "undefined" dans la fonction Google Maps

Question

Bonjour Je suis en boucle sur un objet JSON et crée un nouveau marqueur de carte pour chaque élément. Une fois le marqueur créé, je le pousse vers un tableau (var markers) pour une manipulation ultérieure. Le problème est, quand j'essaye d'accéder aux articles de tableau (par exemple: console.log (marqueurs [3])), je suis donné une valeur "non définie".

Code pertinent ci-dessous:

var map; 
var markers = []; 
var activeFilters = []; 

function initializeMap() { 
    var myLatlng = new google.maps.LatLng(51.506873, -0.125141); 
    var myOptions = { 
     zoom: 14, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true 
    } 
    map = new google.maps.Map(document.getElementById("location_map"), myOptions); 


    $.getJSON('../js/hotspots.json', function(data) { 
     var hotspots = data.scenes[0].hotspots; 
     $.each(hotspots, function(i) { 

      var lat = hotspots[i].latitude; 
      var lon = hotspots[i].longitude; 
      var point = new google.maps.LatLng(lat,lon); 

      var cat = hotspots[i].hotspottype; 
      var weburl = hotspots[i].weburl; 

      var marker = addMarker(point,cat,weburl); 
     }); 

    }); 


} 

function addMarker(point, cat, weburl) { 
    var markerUrl = weburl; 
    var marker = new google.maps.Marker({ 
     position: point, 
     map: map 
    }); 

    marker.category = cat; 
    markers.push(marker); 
}; 

initializeMap(); 
console.log(markers[3]); 

Toute aide serait grandement appréciée.

Answer 1

get JSON fonctionne de manière asynchrone. essayez ceci:

Answer 2

Essayez de

console.log(markers[0]); 

parce qu'en regardant votre code, il y a juste un élément dans le tableau markers.

Si vous allez mettre dans ce tableau 4 éléments, puis en utilisant markers[3] vous accéderez au quatrième élément.

Answer 3

essayer:

initializeMap(); 
setTimeout(function(){ 
    console.log(markers[3]); 
}, 10000);