動態標記 - Google Maps API - 標記不以循環中的i值遞增

Question

我已經創建了下面的地圖api，並有一個來自數據庫的地址數組。 地圖加載正確，但我有以下問題。

1. 動態標記不與的「i」的..所以在地圖顯示所有標記爲「1」的值遞增，而不是「1,2,3,4,5」

   // Define Vars 
   var pinColor = "FE7569"; 
   var marker, i; 
   
   // Set default map center location 
   var latlng = new google.maps.LatLng(-27.79014,153.18049); 
   
   // Create pinShadow for each marker 
   var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com  /chart?chst=d_map_pin_shadow", 
       new google.maps.Size(40, 37), 
       new google.maps.Point(0, 0), 
       new google.maps.Point(12, 35)); 
   
   // Function to create the dynamic marker 
   function pinImage(i){ 
       return image = new google.maps.MarkerImage("http://www.googlemapsmarkers.com/v1/"+i+"/"+pinColor+"/", new google.maps.Size(21, 34), new google.maps.Point(0,0), new google.maps.Point(10, 34)); 
   } 
   
   // Function to run once page has loaded 
       function initialize(){  
   // Set Default settigns for google map 
   var settings = { 
       zoom: 10, 
       center: latlng, 
       mapTypeControl: true, 
       mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
       navigationControl: true, 
       navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}, 
       mapTypeId: google.maps.MapTypeId.ROADMAP}; 
   
   // Start Google Maps and assign it to div on site 
   var map = new google.maps.Map(document.getElementById("map_canvas"), settings);  
   
   // loop though total numner of address in array 
   for (i = 1; i < total; i++) { 
       // Use geocoder to grab latlong for user inputed address 
       geocoder.geocode({ 'address': address[i]}, function(results, status) { 
        if (status == google.maps.GeocoderStatus.OK) { 
         // Redefine map center location 
         if (i = 1){ map.setCenter(results[0].geometry.location); } 
   
         // Create dynamic markers on map as per the address array 
         var marker = new google.maps.Marker({ 
          map: map, 
          position: results[0].geometry.location, 
          title:address[i], 
          zIndex: i, 
          // PROBLEM CODE --- Using the function below it creates all Markers with a "1" instead of the "i" value..?? 
          icon: pinImage(i), 
          shadow: pinShadow 
         });   
        } 
       }); 
       } 
   } 
   

Answer 1

舊的「功能範圍包裝」技巧(function(i) {...})(i)在這裏工作。如果沒有它，執行會獲得i的最終值。此外，if(i = 1)應if(i == 1)

打轉轉：http://jsfiddle.net/BK8vv/

for (var i = 1; i < total; i++) { 
    (function(i) { 

    // Use geocoder to grab latlong for user inputed address 
    geocoder.geocode({ 'address': address[i]}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      // Redefine map center location 
      if (i == 1){ map.setCenter(results[0].geometry.location); } 

      // Create dynamic markers on map as per the address array 
        alert(i); 
      var marker = new google.maps.Marker({ 
       map: map, 
       position: results[0].geometry.location, 
       title:address[i], 
       zIndex: i, 
       // PROBLEM CODE --- Using the function below it creates all Markers with a "1" instead of the "i" value..?? 
       icon: pinImage(i), 
       shadow: pinShadow 
      });   
     } 
     }); 
    })(i); 
    } 
}