一个页面上有多个Google地图实例

时间:2012-04-23 14:23:06

标签: javascript jquery google-maps-api-3 instances

我有一个表单,允许您通过谷歌地图预览坐标。用户可以动态地向表单添加多组坐标。坐标量是可变的。

我使用此代码遍历变量,我觉得它与加载谷歌地图的多个实例有关。第一张地图加载得很好,但第二张地图只在最左边角加载一个图块。如果我更新表格上的坐标,那么所有地图只显示最左侧角落的一个图块。

                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]
                }); 
}

感谢您的帮助! 亚伦

1 个答案:

答案 0 :(得分:4)

看起来你似乎无法让地图调整大小。据我记得,如果地图容器大小发生变化,会发生这种情况。您可以在显示地图后尝试触发调整大小吗?

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