谷歌地圖Api v3 - 具有自定義內容的多個信息窗口

Question

我終於設法添加多個標記與自定義圖標到我的Googlemap。

下一步是爲每個標記添加一個單獨的Infowindow。 不幸的是我不知道如何。

這是到目前爲止我的腳本：

<script type="text/javascript"> 
var offender_locations = [ 
["10010", "http://localhost/safenation/img/map_offender_icon.png"], 
["10001", "http://localhost/safenation/img/map_visitor_icon.png"] 
]; 
var myOptions   = {zoom: 10,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP}; 
var map    = new google.maps.Map(document.getElementById("elementid"), myOptions); 
var latlng    = new google.maps.LatLng(0, 0); 
var marker; 
var i; 
for (i = 0; i < offender_locations.length; i++) { 
var infowindow = new google.maps.InfoWindow(); 
var geocoder_map = new google.maps.Geocoder(); 
var address  = offender_locations[i][0]; 
var icon   = offender_locations[i][1]; 
geocoder_map.geocode({'address': address}, function(results, status) { 
if (status == google.maps.GeocoderStatus.OK) { 
map.setCenter(results[0].geometry.location); 
var marker = new google.maps.Marker({ 
map: map, 
position: map.getCenter(), 
icon: icon 
}); 
google.maps.event.addListener(marker, 'click', (function(marker, i) { 
return function() { 
infowindow.setContent(offender_locations[i][1]); 
infowindow.open(map, marker); 
}  
})(marker, i)); 
} else {alert("The requested offender is not mappable !")};}); 
} 
</script> 

我覺得現在有一個與循環有問題。當我嘗試：

var icon = offender_locations[1][1]; 

所有圖標都 「map_offender_icon.png」

當我使用：

var icon = offender_locations[i][1]; 

沒有什麼變化，所有的圖標仍然是 「map_offender_icon.png」

這似乎是var offender_locations [i] [1];並沒有相應改變。 var offender_locations [i] [0];相應地改變。

Answer 1

你的標誌變量是本地的for循環是不是外循環可見這樣的聲明

var infowindow   = new google.maps.InfoWindow(); 
google.maps.event.addListener(marker, 'click', (function(marker, i) 

不能設置監聽你的標記。

最好的方法是在循環中包含信息窗口初始化，以便將聽衆設置爲整個標記。

希望這會有所幫助。

Answer 2

問題已解決！

工作腳本：

Javascript Loop - 2nd variable Not Displaying

_{（摘自編輯到原來的問題）}