屏幕调整大小后谷歌地图显示？

Question

我正在嵌入谷歌地图的问题,我不明白为什么加载地图不会出现,只有当我调整窗口大小时,我在stackoverflow中经历了不同的解决方案,但它们对我不起作用.

这是我的js代码:

<script>
function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 31.554606, lng: 74.357158},
          zoom: 14
        });
 google.maps.event.addListenerOnce(map, 'idle', function() {
               google.maps.event.trigger(map, 'resize');
            });
         } 
</script>

我的div

<div id="map"></div>

当我加载应用程序时,它看起来像

在重新调整浏览器窗口之后,它看起来非常像这样

请告诉我如何解决这个问题？

Answer 1

当您的"div id = map"可见时,请调用google.maps.event.trigger(map,'resize').请参阅加载后如何使用JavaScript调整Google地图的大小？