0

我对谷歌地图实施有以下问题。我有一个包含餐厅的列表，并为每个餐厅显示单独的地图，而不是在一张地图中显示所有这些。我创建单独的 div：

<div class="googleMap" id="googleMap<?php echo $row[0];?>" style="width:500px;height:380px;position:absolute;"></div>

它有自己的 id。比我有：

<a class="show_map" id="',$row[0],'" href="#" style="font-size:12px;color:red;margin-top:-3px;">restourants on the map</a>

它显示/隐藏带有 id 的 div 和谷歌地图的功能：

function initialize(){    
var restaurant= <?php echo json_encode($r[11]); ?>;    
//alert(hotel);    
var mapProp = {    
center:myCenter,    
zoom:16,    
mapTypeId:google.maps.MapTypeId.ROADMAP    
};    
var map=new google.maps.Map(document.getElementById("googleMap" + restaurant),mapProp);       
var marker=new google.maps.Marker({    
position:myCenter,    
});    
marker.setMap(map);    
var infowindow = new google.maps.InfoWindow({    
content:"Hello World!"    
});    
infowindow.open(map,marker);   
}    
google.maps.event.addDomListener(window, 'load', initialize);

毕竟我只能看到第一个属性的相同地图，我想这是因为所有地图的功能都相同？我对 js 很陌生，现在已经堆了 2 天。请帮我解决如何为每家餐厅制作单独的地图？

至少如果你能给我一些指示，可能是什么原因没有显示每个属性的单独地图.. 提前谢谢你

4

1 回答 1

1

它显示起来很简单。：

<div id="map1"></div>

<br>
<br>
<br>
<br>
<br>

<div id="map2"></div>

***但是您确实需要确保为每个地图执行两个单独的 javascript 函数。从我所见，您正在为具有相同变量名称的两个地图重用相同的代码，基本上覆盖了您的初始地图。

因此，在您的初始化函数中。：

var map1;
var map2;

function initialize(){   
  map1 = new GMap2(document.getElementById("map1"));
  map1.setCenter(new GLatLng(37.4419, -122.1419), 13);

  map2 = new GMap2(document.getElementById("map2"));
  map2.setCenter(new GLatLng(38.88, -100.22), 13);
}
于 2013-09-18T23:01:58.537 回答