InfowWindow在Google Maps API上帮助3
-
09-10-2019 - |
题
与其他网站上的问题相似,在该网站上仅显示所有标记中最后一个标记的信息窗口信息。似乎无法使用提供的任何解决方案来解决这个问题。另外,我的最后一个标记根本没有显示信息窗口。
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="data2.json"></script>
<script type="text/javascript" src="js/markerclusterer.js"></script>
<script type="text/javascript">
google.load('maps', '3', {
other_params: 'sensor=false'
});
google.setOnLoadCallback(initialize);
function initialize() {
var center = new google.maps.LatLng(55.4419, -4.1419);
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var markers = [];
for (var i = 0, dataPhoto; dataPhoto = data.markers[i]; i++) {
var latLng = new google.maps.LatLng(dataPhoto.latitude,dataPhoto.longitude);
var theTitle = dataPhoto.address;
var contentString = '<div align="left"><img src="logo.gif" alt="" width="242" height="71" /><br /><br /><p style="color:#000000;">' + data.markers[i].address + '<br />' + dataPhoto.telephone + '</p></div>';
var infowindow = new google.maps.InfoWindow({
content: contentString,
});
var thisIcon = 'markers/image.png';
for (var i = 0, marker; marker = markers[i]; i++) {google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,this);});
}
var marker = new google.maps.Marker({
position: latLng,
clickable: true,
title: theTitle,
icon: thisIcon,
});
markers.push(marker);
}
var markerCluster = new MarkerClusterer(map, markers);
}
</script>
任何帮助都非常感谢!
解决方案
我尚未对此进行测试,但应该起作用 - 请看一下: http://code.google.com/apis/maps/documentation/javascript/events.html#eventclosures
<script src="http://www.google.com/jsapi">
</script>
<script type="text/javascript" src="data2.json">
</script>
<script type="text/javascript" src="js/markerclusterer.js">
</script>
<script type="text/javascript">
google.load('maps', '3', {
other_params: 'sensor=false'
});
google.setOnLoadCallback(initialize);
function initialize(){
var center = new google.maps.LatLng(55.4419, -4.1419);
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var markers = [];
for (var i = 0, dataPhoto; dataPhoto = data.markers[i]; i++) {
var latLng = new google.maps.LatLng(dataPhoto.latitude, dataPhoto.longitude);
var theTitle = dataPhoto.address;
var contentString = '<div align="left"><img src="logo.gif" alt="" width="242" height="71" /><br /><br /><p style="color:#000000;">' + data.markers[i].address + '<br />' + dataPhoto.telephone + '</p></div>';
var thisIcon = 'markers/image.png';
var marker = new google.maps.Marker({
position: latLng,
clickable: true,
title: theTitle,
icon: thisIcon,
});
attachIWindow(contentString, marker);
markers.push(marker);
}
var markerCluster = new MarkerClusterer(map, markers);
}
function attachIWindow(content, marker){
var infowindow = new google.maps.InfoWindow({
content: content,
});
google.maps.event.addListener(marker, 'click', function(){
infowindow.open(map, marker);
});
}
</script>
其他提示
我们可以利用 关闭 解决这个问题
使用以下代码段添加 信息窗口 至 标记
function AddInfoWidnow(marker,message)
{
var infowindow = new google.maps.InfoWindow({ content: message });
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(marker.get('map'), marker);
});
}
要查看工作样本 这里
如果我正确地理解这一点,请查看封闭情况并尝试正确理解它们。
不隶属于 StackOverflow