我有一个谷歌地图,在我的信息窗口中它显示了信息窗口中的所有地址。当我将 php 变量从我的 foreach 数组中移出时,它只显示数组中的最后一项。我是否错过了完成数组或没有在 infoWindow 函数中正确声明它?
这是我的支持代码:
更新的代码现在拉入 MARKER_0、MARKER_1 等,而不是地址 (a,b,c,d)。
<script type="text/javascript">
$(document).ready(function() {
//create an array to store lat n lon and type
var lat= [];
var lon= [];
var type= [];
var address= [];
var restaurant = 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=B|FF0000|000000';
var bar = 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|FF0000|000000';
var x=0; //to store index for looping
var map = null; //create a map and define it's value to null
var markerArray = []; //create a global array to store markers
var infowindow; //create infowindow to show marker information
//looping for getting value from database using php
<?php foreach($latlong as $row): ?>
lat.push(<?php echo $row['lat']; ?>);
lon.push(<?php echo $row['long']; ?>);
type.push(<?php echo $row['type']; ?>);
address.push("<?php echo $row['address']; ?>");
x++;
<?php endforeach; ?>
function initialize() {
//set center from the map
var myOptions = {
zoom: 10,
center: new google.maps.LatLng(lat[0], lon[0]),
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
//make a new map
map = new google.maps.Map(document.getElementById("map"), myOptions);
//define value and size for infowindow
infowindow = new google.maps.InfoWindow({
size: new google.maps.Size(150, 50)
});
// Add markers to the map
// Set up markers based on the number of elements within the array from database
for (var i = 0; i < x; i++) {
createMarker(new google.maps.LatLng(lat[i], lon[i]), type[i],address[i], 'marker_'+i);
;
}
}
function createMarker(latlng, type, id, address){
var marker = new google.maps.Marker({
position: latlng,
map: map,
icon: type,
id: id,
address:address
});
google.maps.event.addListener(marker, 'mouseover', onMarkerClick);
markerArray.push(marker); //push local var marker into global array
}
//create a function that will open infowindow when a marker is clicked
var onMarkerClick = function(latlng) {
var marker = this;
var latLng = marker.getPosition();
infowindow.setContent('<h3>Marker address is:</h3>'+ marker.address +'</div>');
infowindow.open(map, marker, marker.address);
};
window.onload = initialize;
});
</script>
在我的脚本部分的萤火虫中,数据是这样输出的,所以我知道它正在提取正确的信息!
//循环使用php从数据库中获取值
lat.push(lat);
lon.push(lng);
type.push(restaurant);
address.push("A");
x++;
lat.push(lat);
lon.push(lng);
type.push(bar);
address.push("B");
x++;
lat.push(lat);
lon.push(lng);
type.push(restaurant);
address.push("C");
x++;
lat.push(lat);
lon.push(lng);
type.push(bar);
address.push("D");
x++;
任何帮助将非常感激。