谷歌地圖顯示亂碼

Question

我的地圖渲染不正確。

我從未經歷過這種情況（注意右側按鈕上的圖標被扭曲了）。 用於生成地圖的代碼非常簡單：

<script>
    function initMap() {
        var mapDiv = document.getElementById('map');
        var map = new google.maps.Map(mapDiv, {
            center: {lat: 43.828430, lng: 18.3445995},
            zoom: 18
        });

        new google.maps.Marker({
            position: {lat: 43.828430, lng: 18.3445995},
            map: map
        });
    }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA9zhNUfid1PgR6FZ-g8xTp_NCqV3JvsHM&callback=initMap" async defer></script>

有任何想法嗎？

Answer 1

不知道為什么，但是當我嘗試您的代碼時，它起作用了，但地圖也是灰色的。 當我指出style="width:500px;height:500px"地圖開始工作

Answer 2

好的，問題是我有一個錯誤的 CSS 規則干擾了谷歌的渲染。

作為參考，img 上的最大寬度為 100%。