Google Map API不会显示

Question

我看不到Google地图

代码

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


// css
html,
    body {
        height: 100%;
        margin: 0;
        padding: 0;
    }
    #map {
        height: 100%;
    }

// scripts

<script async defer 
                    src="https://maps.googleapis.com/maps/api/js?key=PLACED MY CODE HERE... &callback=initMap"></script>
<script>
    function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
            center: {lat: -34.397, lng: 150.644},
            zoom: 8
        });
    }
</script>

结果

我的视图中没有任何显示，并且控制台或“网络”标签中也没有错误。

有什么主意吗？

Answer 1

也尝试使用有效宽度，例如：（仅用于测试）

// css
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
#map {
    height: 640px;
    width:800px;
}