我创建了使用谷歌地图V3显示群集标记的代码。问题在于每个标记的infowindow
。我认为错误是在循环的每次迭代中,重新初始化另一个标记的内容,只保存最后插入的内容。
这是我的尝试......
http://www.ermes.net/user/loadscrolling/load_first.php
感谢您的帮助!
<script type="text/javascript">
function initialize() {
var center = new google.maps.LatLng(37.4419, 9.1419);
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 2,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var tweets = <?php echo json_encode($mapLocations); ?>;
var markers = [];
<? for ($j=0; $j<count($resultArrayAd); $j++) { ?>
var i=<?=$j++?>;
var latLng = new google.maps.LatLng(parseFloat(<?=$resultArrayAd[$j]['Lat']?>),parseFloat(<?=$resultArrayAd[$j]['Lng']?>));
<?
$userList2 = new user_account($resultArrayAd[$j]["user_id"]);
$user_avatar2=$userList2->get_avatar();
$path2 =enleveaccents($user_avatar2->get_document_filename());
$user_nick=enleveaccents($resultArrayAd[$j]["user_name"]);
$user_id=$resultArrayAd[$j]['user_id'];
$usr_details = new user_details($user_id);
if (strlen($path2) > 0) {
$path_img= "/images/thumb_".$path2;
} else {
$path_img = "/img/avatar_profilo.jpg";
}
?>
var contentString = '<table><tr><td width="350">'+
'<a href="/user/<?=$user_id?>/<?=$user_nick?>.html" target="_top">'+
'<img align=left width=100 height=65 border=0 src="<?=$path_img?>" hspace=4 vspace=2>'+
'<font size=1 face=verdana><b><?=$user_nick?></b></font></a><br/>'+
'<span style="color:#555555;font-size:12px;line-hieght:13px;">'+
'<b>Indirizzo:</b><br/>' +
'<b>Tel:</b> <br/>'+
'</span>'+
'<div class="clearBoth"></div></td></tr></table>'+
'<div class="clearBoth"></div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: latLng,
map: map,
icon:"<?=$resultArrayAd[$j]['user_icon']?>",
title:"<?=$user_nick?>",
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
markers.push(marker);
<? } ?>
var markerCluster = new MarkerClusterer(map, markers);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
答案 0 :(得分:0)
我找到了这个bug的解决方案;-) 这是一个正确的代码..
<script type="text/javascript">
function initialize() {
var center = new google.maps.LatLng(9.4419, 9.1419);
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 2,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var markers = [];
// create the infowindow out of the for boucle
var infoWindow = new google.maps.InfoWindow;
<? for ($j=0; $j<count($resultArrayAd); $j++) { ?>
var i=<?=$j++?>;
var latLng = new google.maps.LatLng(parseFloat(<?=$resultArrayAd[$j]['Lat']?>),parseFloat(<?=$resultArrayAd[$j]['Lng']?>));
<?
$userList2 = new user_account($resultArrayAd[$j]["user_id"]);
$user_avatar2=$userList2->get_avatar();
$path2 =enleveaccents($user_avatar2->get_document_filename());
$user_nick=enleveaccents($resultArrayAd[$j]["user_name"]);
$user_id=$resultArrayAd[$j]['user_id'];
$usr_details = new user_details($user_id);
if (strlen($path2) > 0) {
$path_img= "/images/thumb_".$path2;
} else {
$path_img = "/img/avatar_profilo.jpg";
}
?>
var html = '<table><tr><td width="200">'+
'<a href="/user/<?=$user_id?>/<?=$user_nick?>.html" target="_top">'+
'<img align=left width=80 height=65 border=0 src="<?=$path_img?>" hspace=4 vspace=2>'+
'<font size=1 face=verdana><b><?=$user_nick?></b></font></a><br/>'+
'<span style="color:#555555;font-size:12px;line-hieght:13px;">'+
'<b>Indirizzo:</b> <?=enleveaccents($usr_details->user_address);?><br/>' +
'<b>Tel:</b> <?=enleveaccents($usr_details->user_phone);?><br/>'+
'</span>'+
'<div class="clearBoth"></div></td></tr></table>'+
'<div class="clearBoth"></div>';
var marker = new google.maps.Marker({
position: latLng,
map: map,
icon:"<?=$resultArrayAd[$j]['user_icon']?>",
title:"<?=$user_nick?>",
});
// call to the function....
bindInfoWindow(marker, map, infoWindow, html);
markers.push(marker);
<? } ?>
// create a function bindInfoWindow
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
var markerCluster = new MarkerClusterer(map, markers);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>