Utilisation d'un index pour la boucle à travers Google Maps Géocode API

Question

J'essaie de prendre un tableau javascript de tableaux nommés "marqueurs" qui stocke le nom et l'adresse des lieux que je veux ajouter comme marqueurs sur une carte Google.

var markers = [['Name of Place', '123 1st Street New York, NY'], ['Place 2', '122 1st Street, New York, NY']]; 

Je n'ai aucun problème à faire apparaître la carte correctement, ou même à faire apparaître le marqueur avec un titre accessible à partir du tableau "marqueurs". Tant que j'accède au titre du tableau "markers" explicitement. Comme indiqué ci-dessous:

var map; 
var geocoder; 

    function initMap(){ 
      map = new google.maps.Map(document.getElementById('map'), { 
        center: {lat: 34.6760942, lng: -82.8386035}, 
        zoom: 13 
      }); 

      geocoder = new google.maps.Geocoder(); 

      for(i = 0; i < markers.length; i++){ 
       geocoder.geocode({'address': markers[i][1]}, function(results, status) { 
        if(status == 'OK'){ 
         marker = new google.maps.Marker({ 
           map: map, 
           position: results[0].geometry.location, 
           title: markers[0][0] 
         }); 
        } else { 
         alert('Geocode was not successful because: ' + status); 
        } 
       }); 
      } 
    } 

Cependant, je veux être en mesure d'utiliser l'index, « i », dans la boucle pour créer itérativement ces marqueurs. Si j'essaie de saisir itérativement les titres du tableau "marqueurs" en utilisant (title: markers [i] [0]) comme indiqué ci-dessous. Je reçois une « erreur de type Uncaught: Impossible de lire la propriété '0' undefined

carte var; var géocodage,

function initMap(){ 
     map = new google.maps.Map(document.getElementById('map'), { 
       center: {lat: 34.6760942, lng: -82.8386035}, 
       zoom: 13 
     }); 

     geocoder = new google.maps.Geocoder(); 

     for(i = 0; i < markers.length; i++){ 
      geocoder.geocode({'address': markers[i][1]}, function(results, status) { 
       if(status == 'OK'){ 
        marker = new google.maps.Marker({ 
          map: map, 
          position: results[0].geometry.location, 
          title: markers[i][0] 
        }); 
       } else { 
        alert('Geocode was not successful because: ' + status); 
       } 
      }); 
     } 
} 

Pour une raison quelconque, dans la fonction de l'indice, i, n'est pas défini. . Comment puis-je faire pour être assuré que « i » est définie à l'intérieur de la fonction?

Answer 1

puis-je vous suggère d'utiliser la fermeture?

function geocodeEncapsulation(i) { 
    return(function(results, status){ 
     if(status == 'OK'){ 
        marker = new google.maps.Marker({ 
          map: map, 
          position: results[0].geometry.location, 
          title: markers[i][0] 
        }); 
       } else { 
        alert('Geocode was not successful because: ' + status); 
       } 
    }); 
} 

function initMap(){ 
     map = new google.maps.Map(document.getElementById('map'), { 
       center: {lat: 34.6760942, lng: -82.8386035}, 
       zoom: 13 
     }); 

     geocoder = new google.maps.Geocoder(); 

     for(i = 0; i < markers.length; i++){ 
      geocoder.geocode({'address': markers[i][1]}, geocodeEncapsulation(i)); 
     } 
}