Google地圖標記錯誤位置

我在地圖上有多個標記。但它不會將相應的infoWindows附加到標記。他們總是在左上角。不知道這裏干擾什麼。Google地圖標記錯誤位置

var geocoder = new google.maps.Geocoder(); 

    var addresses = [ 
     'Marienstr. 37a 27472 Cuxhaven', 
     'Bahnhofstr. 15 21745 Hemmoor', 
     'Richtpfad 20 26506 Norden', 
     'Eulenbusch 4 21391 Reppenstedt' 
    ]; 

    var bounds = new google.maps.LatLngBounds(); 

    var map = new google.maps.Map(document.getElementById('map'), { 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    var infowindow = new google.maps.InfoWindow(), marker, i; 

    for (i=0; i < addresses.length; i++) { 
     geocoder.geocode({ 'address': addresses[i]}, function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
      // map.setCenter(results[0].geometry.location); 
      marker = new google.maps.Marker({ 
       map: map, 
       position: results[0].geometry.location 
      }); 

      google.maps.event.addListener(marker, 'click', (function(marker, i) { 
       return function() { 
        infowindow.setContent(addresses[i]); 
        infowindow.open(map, marker); 
       }; 
      })(marker, i)); 

      bounds.extend(results[0].geometry.location); 
      map.setCenter(bounds.getCenter()); 
      map.fitBounds(bounds); 
      } else { 
      alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
    }

來源

2014-10-16 Chrisissorry

它未能這裏（如MrUpsidown觀察到的）infowindow.setContent(addresses[i]);因爲當點擊監聽運行i = 4的地址和[4]中不存在。

解決您的問題的一種方法是對地理編碼功能以及標記（下面）使用函數關閉。但正如Upsidown先生所觀察到的，如果你有超過10個地址，它將無法工作。

function geocodeAddress(addresses, i) { 
    geocoder.geocode({ 'address' : addresses[i]}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     // map.setCenter(results[0].geometry.location); 
     marker = new google.maps.Marker({ 
      map: map, 
      position: results[0].geometry.location 
     }); 

     google.maps.event.addListener(marker, 'click', (function(marker, i) { 
      return function() { 
       infowindow.setContent(addresses[i]); 
       infowindow.open(map, marker); 
      }; 
     })(marker, i)); 

     bounds.extend(results[0].geometry.location); 
     map.setCenter(bounds.getCenter()); 
     map.fitBounds(bounds); 
     } else { 
     alert("Geocode was not successful for the following reason: " + status); 
     } 
    }); 
}

工作代碼片段：

function geocodeAddress(addresses, i) { 
 
     geocoder.geocode({ 'address' : addresses[i]}, function(results, status) { 
 
      if (status == google.maps.GeocoderStatus.OK) { 
 
      // map.setCenter(results[0].geometry.location); 
 
      marker = new google.maps.Marker({ 
 
       map: map, 
 
       position: results[0].geometry.location 
 
      }); 
 

 
      google.maps.event.addListener(marker, 'click', (function(marker, i) { 
 
       return function() { 
 
        infowindow.setContent(addresses[i]); 
 
        infowindow.open(map, marker); 
 
       }; 
 
      })(marker, i)); 
 

 
      bounds.extend(results[0].geometry.location); 
 
      map.setCenter(bounds.getCenter()); 
 
      map.fitBounds(bounds); 
 
      } else { 
 
      alert("Geocode was not successful for the following reason: " + status); 
 
      } 
 
     }); 
 
    } 
 

 
    var geocoder = new google.maps.Geocoder(); 
 
    
 
    var addresses = [ 
 
     'Marienstr. 37a 27472 Cuxhaven', 
 
     'Bahnhofstr. 15 21745 Hemmoor', 
 
     'Richtpfad 20 26506 Norden', 
 
     'Eulenbusch 4 21391 Reppenstedt' 
 
    ]; 
 
    
 
    var bounds = new google.maps.LatLngBounds(); 
 
    
 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    
 
    var infowindow = new google.maps.InfoWindow(), marker, i; 
 
    
 
    for (i=0; i < addresses.length; i++) { 
 
     geocodeAddress(addresses,i); 
 
    }

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
 
<div id="map" style="width: 500px; height: 400px;"></div>

來源

2014-10-16 20:22:22 geocodezip

地理編碼器是異步的。您的for循環在第一個地理編碼請求獲得響應之前結束。所以你不能使用i，因爲它永遠是4和addresses[4]不存在。

的谷歌地圖API提供了地理編碼地理編碼器類和反向從用戶輸入動態天氣預報

無論如何，因爲你不應該做這種方式。當你第一次加載API時，你將被分配一個地理編碼請求的初始配額。一旦你使用了這個配額，額外的請求將以每秒爲基礎進行速率限制。如果您希望對靜態的已知地址進行地理編碼，請參閱地理編碼Web服務文檔。

https://developers.google.com/maps/documentation/javascript/geocoding

如果地理編碼大量的地址，特別是在循環（每秒限制），您可能會碰到的限制。

來源

2014-10-16 19:04:57 MrUpsidown

Google地圖標記錯誤位置

回答

相關問題