我尝试在谷歌地图信息窗口中显示一张小地图。目的是一旦用户单击标记,就会打开一个信息窗口,其中包含一个小地图,显示卫星视图。下面的主要代码运行良好。唯一的问题是我有一个空的“map_loc”,因为我不知道将“var map_loc”放在哪里。
我在 mysql 数据库的 while 循环中使用查询来获取所需的信息。
基本上我的问题是,我必须将那部分代码放在下面的主代码中以显示名为“map_loc”的小地图,其中 div 位于标记“位置”中:
var map_loc = new google.maps.Map(document.getElementById('map_loc'), {
zoom: 17,
center: new google.maps.LatLng(<?php echo $latlng_loc?>),
mapTypeId: google.maps.MapTypeId.SATELLITE
});
-
<div id="map" style="width:600px; height:600px;"></div>
<script type="text/javascript">
var locations = [
<?php
while ($x = $req->fetch())
{
// variables obtained :
$name = $d['name'];
$latlng_loc = $d['latlng']; // I need it to display the marker at the good location but also now to display the map within the infowindow
?>
['<h3><?php echo $name;?></h3><div id="loc_map" style="width:250px; height:150px;"></div>', <?php echo $latlng_loc?>],<?php
}
?>
];
// here is the main map
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: new google.maps.LatLng(<?php echo $latlng?>),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
谢谢你的帮助。