Question

我终于设法将多个带有自定义图标的标记添加到我的Google地图中。

下一步是为每个标记添加一个单独的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)

无法为您的标记设置侦听器。

最好的方法是在循环中包含Info窗口初始化，以将侦听器设置为整个标记。

希望这有帮助。

Answer 2

问题已经解决了！

工作脚本：

Javascript Loop - 2nd variable Not Displaying

_{（从原始问题的编辑中提取）}

Google Maps Api v3 - 具有自定义内容的多信息Windows

2 个答案: