Question

我正在尝试将自定义地图添加到我的网站，这是我第一次使用Google Maps API V3

问题是只有部分地图出现在地图div中，地图的所有剩余部分都会保持卸载状态，除非我重新调整浏览器的大小或拖动地图的可见部分才能正常加载。 / p>

这是HTML代码

 <div id="map_canvas" style="width:40%; height:1000px"></div>

这是jquery代码

function initialize() {
            var latlng = new google.maps.LatLng(57.0442, 9.9116);
            var settings = {
                zoom: 15,
                center: latlng,
                mapTypeControl: true,
                mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
                navigationControl: true,
                navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
                mapTypeId: google.maps.MapTypeId.ROADMAP};
            var map = new google.maps.Map(document.getElementById("map_canvas"), settings);


            google.maps.event.addListener(map, 'idle', function() {
                google.maps.event.trigger(map, 'resize'); 

            });

您还可以通过以下测试链接Here is the link

与我们联系

Answer 1

由于地图最初不可见，因此必须在显示地图时触发地图（或窗口）的调整大小事件。
这将强制API加载缺少的图块。

$.animate()末尾的openSection()回调应该是一个好地方。

谷歌地图API v3仅显示地图的一部分，其他部分显示在调整大小窗口或绘图地图上

1 个答案: