Javascript 标记内容 (infoWindow) Google Maps
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5868903/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Marker content (infoWindow) Google Maps
提问by DarrylGodden
I'm trying to add infoWindow's to multiple markers on a Google Map. The closest I have come is to get an infoWindow to display the last address you can see in the array, on all markers. The bit of code I have pasted below does not work, I get an "Uncaught TypeError: Cannot read property '4' of undefined". I'm sure this is a scope issue, but I'm going round in circles here and could do with some help:
我正在尝试将 infoWindow 添加到 Google 地图上的多个标记。我最接近的是获取一个 infoWindow 来显示您可以在数组中看到的最后一个地址，在所有标记上。我在下面粘贴的那段代码不起作用，我收到“未捕获的类型错误：无法读取未定义的属性 '4'”。我确定这是一个范围问题，但我在这里转了一圈，可以得到一些帮助：
var hotels = [
['ibis Birmingham Airport', 52.452656, -1.730548, 4, 'Ambassador Road<br />Bickenhill<br />Solihull<br />Birmingham<br />B26 3AW','(+44)1217805800','(+44)1217805810','[email protected]','http://www.booknowaddress.com'],
['ETAP Birmingham Airport', 52.452527, -1.731644, 3, 'Ambassador Road<br />Bickenhill<br />Solihull<br />Birmingham<br />B26 3QL','(+44)1217805858','(+44)1217805860','[email protected]','http://www.booknowaddress.com'],
['ibis Birmingham City Centre', 52.475162, -1.897208, 2, 'Ladywell Walk<br />Birmingham<br />B5 4ST','(+44)1216226010','(+44)1216226020','[email protected]','http://www.booknowaddress.com']
];
for (var i = 0; i < hotels.length; i++) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(hotels[i][1], hotels[i][2]),
map: map,
icon: image,
title: hotels[i][0],
zIndex: hotels[i][2]
});
var infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(marker, 'click', function () {
var markerContent = hotels[i][4];
infoWindow.setContent(markerContent);
infoWindow.open(map, this);
});
}
Thanks in anticipation.
感谢期待。
回答by DarrylGodden
We've solved this, although we didn't think having the addListener outside of the for would make any difference, it seems to. Here's the answer:
我们已经解决了这个问题，虽然我们认为在 for 之外使用 addListener 不会有什么不同，但似乎确实如此。答案如下：
Create a new function with your information for the infoWindow in it:
使用您的 infoWindow 信息创建一个新函数：
function addInfoWindow(marker, message) {
var infoWindow = new google.maps.InfoWindow({
content: message
});
google.maps.event.addListener(marker, 'click', function () {
infoWindow.open(map, marker);
});
}
Then call the function with the array ID and the marker you want to create:
然后使用数组 ID 和要创建的标记调用函数：
addInfoWindow(marker, hotels[i][3]);
回答by BenC
Although this question has already been answered, I think this approach is better : http://jsfiddle.net/kjy112/3CvaD/extract from this question on StackOverFlow google maps - open marker infowindow given the coordinates:
虽然已经回答了这个问题，但我认为这种方法更好：http: //jsfiddle.net/kjy112/3CvaD/从 StackOverFlow谷歌地图上的这个问题摘录- 打开标记信息窗口给出坐标：
Each marker gets an "infowindow" entry :
每个标记都有一个“信息窗口”条目：
function createMarker(lat, lon, html) {
var newmarker = new google.maps.Marker({
position: new google.maps.LatLng(lat, lon),
map: map,
title: html
});
newmarker['infowindow'] = new google.maps.InfoWindow({
content: html
});
google.maps.event.addListener(newmarker, 'mouseover', function() {
this['infowindow'].open(map, this);
});
}
