在一个页面上显示Google地图的多个实例

我有一个表单，允许您通过谷歌地图预览坐标。用户可以动态地向表单添加多组坐标。坐标的数量是可变的。在一个页面上显示Google地图的多个实例

我用这段代码循环访问变量，我觉得它需要加载多个Google Maps实例。第一张地图加载得很好，但第二张地图只在最左边的角落加载一个图块。如果我更新表格上的坐标，那么所有地图只显示最左侧的一个图块。

   while (tempClone != cloneCount) { 
var lat_lng = new google.maps.LatLng(lat, lng);    

       options = { 
        zoom: 14, 
        center: lat_lng, 
        panControl: false, 
        zoomControl: false, 
        mapTypeId: google.maps.MapTypeId.TERRAIN 
       }; 

       map[tempClone] = new google.maps.Map(document.getElementById("map"+tempClone), options); 

       var infowindow = new google.maps.InfoWindow({ 
        content: inputBL[tempClone][0][1] + 'Entrance' 
       }); 

       marker[tempClone] = new google.maps.Marker({ 
        position: lat_lng, 
        map: map[tempClone], 
        title: inputBL[tempClone][0][1] 
       }); 
}

谢谢你的帮助！ Aaron

来源

2012-04-23 Ratty

你可以发布一个链接到你的实时代码，或者把它放在JSFiddle上，以便我们可以在上下文中查看它吗？很难仅调试部分代码。 – 2012-04-23 16:56:53

是的，我会试着弄一点小提琴。谢谢。 – Ratty 2012-04-23 19:17:07

嘿马诺，很抱歉等了很久。我只能将项目上传到外部服务器。我希望这会有所帮助，因为我无法在jsfiddle下模拟这个问题。这里是链接：http://s401600969.onlinehome.us/testing/yii-front/index.php/reportForm/create 希望，这给你一个更好的主意，以了解正在发生的事情。问题在于洞穴入口。输入坐标（度或十进制）后，它显示图像就好了，如果再次编辑入口，它不会正确显示。以下是坐标示例：59.32522,18.07002 再次感谢您的帮助！ – Ratty 2012-04-24 03:36:27

它几乎看起来像你无法让地图调整大小。从我记得，如果地图容器大小发生变化，会发生这种情况。你可以尝试在显示地图后触发调整大小吗？

google.maps.event.trigger(map, "resize");

来源

2012-04-25 00:45:48 Rick

我<3你。我认为这与刷新问题有关，因为无论何时我上下移动萤火虫，它都会纠正问题，但我不知道这是否是一个肯定的问题。它现在已经修复。谢谢你的帮助！ =） – Ratty 2012-04-25 04:29:30

在一个页面上显示Google地图的多个实例

回答

相关问题