Google地图仅显示在地图div的左上角

Question

使用谷歌文档，我试图将谷歌地图嵌入到剃刀网页中。

<script>
    function initialize() {           
        var lat = 45.430817;
        var lon = 12.331516;

        var mapCanvas = document.getElementById('map-canvas');
        var mapOptions = {                
            center: new google.maps.LatLng(lat, lon),
            zoom: 10,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(mapCanvas, mapOptions);

    }
    google.maps.event.addDomListener(window, 'load', initialize);
    google.maps.event.addDomListener(window, "resize", function() {
        var center = map.getCenter();
        google.maps.event.trigger(map, "resize");
        map.setCenter(center); 
    });
</script>

但是最终结果看起来像这样

Answer 1

它已经发生在我身上。 在这种情况下，您需要在单击选项卡后立即添加调整大小。 一些事情像：

<div id='init_tab' class='tab_item' onclick="google.maps.event.trigger(map, 'resize');">