私は複数のマーカーをカスタムGoogleマップを持っています。私は複数のマーカーの逆ジオロケーションを使用しています

Question

私は複数のマーカーの逆ジオロケーションを使用してカスタムGoogleマップ複数マーカーを持っています。呼び出しbtwn呼び出しほとんどのアドレスの結果を得る

for(var z = 0 ; z < markersArray.length; z++){ 
    alert(z); 
    geocoder.geocode({'location': markersArray[z].position}, function(results, status) { 

     if(status == 'OK'){ 
      if(results != null){ 
       address = address + z +" : "+ results[1].formatted_address + "<br>"; 
       alert(z); 
      } 
      else 
      { 

       address = address + z +" : "+"Unknown Address" + "<br>"; 
      } 
     } 
     else{ 
      alert(z); 
      address = address + z +" : "+"Unknown Address"+ "<br>"; 
     } 

    }); 
} 

Answer 1

ジオコーダは非同期です。コールバック関数が実行されるまでに、ループは完了し、zはmarkersArray.length（配列の有効なエントリではない）と等しくなります。この問題は、関数クロージャ（[この質問の例で解決することができます。Google Maps JS API v3 - Simple Multiple Marker Exampleマーカークリックリスナー関数のための

for (var z = 0; z < markersArray.length; z++) { 
    geocoder.geocode({ 
    'location': markersArray[z].position 
    }, (function(z) { 
    // get function closure on z 
    return function(results, status) { 
     if (status == 'OK') { 
     if (results != null) { 
      var address = z + " : " + results[0].formatted_address + "<br>"; 
      var marker = new google.maps.Marker({ 
      position: markersArray[z].position, 
      title: address, 
      map: map 
      }); 
      bounds.extend(marker.getPosition()); 
      map.fitBounds(bounds); 
      google.maps.event.addListener(marker,'click', function(evt) { 
      infowindow.setContent(address); 
      infowindow.open(map, this); 
      }) 
     } else { 
      var address = z + " : " + "Unknown Address" + "<br>"; 
     } 
     } else { 
     var address = z + " : " + "Unknown Address" + "<br>"; 
     } 
    } 
    })(z)); 
} 

proof of concept fiddle

コードスニペット：

var geocoder; 
 
var map; 
 
var markersArray = [{position: {lat: 40.7127837,lng: -74.0059413}}, 
 
{position: {lat: 40.735657,lng: -74.1723667}}, 
 
{position: {lat:39.2903848,lng: -76.6121893}}, 
 
{position: {lat: 39.9525839,lng: -75.1652215}}]; 
 
function initialize() { 
 
    map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(37.4419, -122.1419), 
 
     zoom: 13, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    geocoder = new google.maps.Geocoder(); 
 
    var infowindow = new google.maps.InfoWindow(); 
 
    var bounds = new google.maps.LatLngBounds(); 
 
    for (var z = 0; z < markersArray.length; z++) { 
 
    geocoder.geocode({ 
 
     'location': markersArray[z].position 
 
    }, (function(z) { 
 
     // get function closure on z 
 
     return function(results, status) { 
 

 
     if (status == 'OK') { 
 
      if (results != null) { 
 
      var address = z + " : " + results[0].formatted_address + "<br>"; 
 
      var marker = new google.maps.Marker({ 
 
       position: markersArray[z].position, 
 
       title: address, 
 
       map: map 
 
      }); 
 
      bounds.extend(marker.getPosition()); 
 
      map.fitBounds(bounds); 
 
      google.maps.event.addListener(marker, 'click', function(evt) { 
 
       infowindow.setContent(address); 
 
       infowindow.open(map, this); 
 
      }) 
 
      } else { 
 
      var address = z + " : " + "Unknown Address" + "<br>"; 
 
      } 
 
     } else { 
 
      var address = z + " : " + "Unknown Address" + "<br>"; 
 
     } 
 
     } 
 
    })(z)); 
 
    } 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>

Answer 2

呼び出しの間に短い遅延を追加しようとします。一度同じ問題があった場合は、各呼び出しの結果を確認して、それらを数回再送信してみてください。