谷歌地圖：從地理編碼的郵政編碼獲取緯度/經度

我目前正在使用物體的地址繪製地圖上的多個點。該程序遍歷該對象，地址爲geocodes，並繪製每個位置的標記。谷歌地圖：從地理編碼的郵政編碼獲取緯度/經度

我遇到的問題是當用戶點擊列表中的某個地方時，地圖將平移到該位置。 API具有panTo()函數，該函數接受lat, lng值，但來自地址代碼函數的結果（即results[0].geometry.location）在其外部不可用。

問題

我怎麼莫名其妙檢索結果的lat, lng，也許它們添加到現有的數據對象，並使用它們的功能之外，所以我能夠在panTo()功能使用它們？

[緯度/經度值在HTML輸出data屬性]

Click處理

$('.place').on('click', function() { 
    $this = $(this); 
    lat = $this.data('lat'); 
    lng = $this.data('lng'); 

    map.panTo(new google.maps.LatLng(lat, lng)); 
});

數據

var locations = [ 
    { 
     id: 'place1', 
     postcode: 'B1 1AA' 
    }, 
    { 
    id: 'place2', 
     postcode: 'CB9 8PU' 
    } 
];

代碼

for (i = 0; i < locations.length; i++) { 

    geocoder.geocode({'address': locations[i].postcode}, function(results, status) { 
     if(status == google.maps.GeocoderStatus.OK) { 

      marker = new google.maps.Marker({ 
       position: results[0].geometry.location, 
       map: map 
      }); 

     } else { 
      console.log('Geocode was not successful ' + status); 
     } 

    }); // end geocode 


    $(places).append(
     '<li class="place" data-id="'+locations[i].id+'" data-lat="<!--lat to go here-->" data-lng="<!--lng to go here-->">'+ 
      '<div class="place-wrap">'+ 
       '<h2>'+locations[i].name+'</h2>'+ 
       '<p class="territory">'+locations[i].territory+'<p>'+ 
      '</div>'+ 
     '</li>' 
    ); 

} // end for

來源

2013-09-27 ashley

給這一去。由於地理編碼的異步特性，IIFE在那裏包含索引，因此您不會繼續觸擊locations陣列的最後一個索引。

for (i = 0, l = locations.length; i < l; i++) { 

    (function(i) { // index passed in as parameter 

     geocoder.geocode({ address: locations[i].postcode }, function(results, status) { 

     if (status == google.maps.GeocoderStatus.OK) { 

      marker = new google.maps.Marker({ 
      position: results[0].geometry.location, 
      map: map 
      }); 

      $('#places').append(
      '<li class="place" data-id="' + locations[i].id + '" data-lat="' + results[0].geometry.location.lat() + '" data-lng="' + results[0].geometry.location.lng() + '">' + 
      '<div class="place-wrap">' + 
      '<h2>' + locations[i].name + '</h2>' + 
      '<p class="territory">' + locations[i].territory + '<p>'+ 
      '</div>' + 
      '</li>' 
     ); 

     } else { 
      console.log('Geocode was not successful ' + status); 
     } 

     }); 

    }(i)); // index passed in to IIFE 

    }

來源

2013-09-27 16:59:13 Andy

谷歌地圖：從地理編碼的郵政編碼獲取緯度/經度

回答

相關問題