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

Rat*_*tty 5 javascript jquery instances google-maps-api-3

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

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

                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]
                }); 
}
Run Code Online (Sandbox Code Playgroud)

感谢您的任何帮助!亚伦

Ric*_*ick 4

看起来您在调整地图大小时遇到​​了困难。据我所知,如果地图容器大小发生变化,就会发生这种情况。您可以尝试在显示地图后触发调整大小吗?

google.maps.event.trigger(map, "resize");
Run Code Online (Sandbox Code Playgroud)