Javascript 谷歌地图API加载不正确

我的代码和加载带有样式的嵌入式Google Maps API有问题。请看下面我的代码和我加载网页时的屏幕截图

<section class="container-fluid text-center">
        <div class="row">
             <div class="col">
                <div id="map" style="height: 100%;
            width: 750px;"></div>
            </div>
        </div>
    </section>


            <script>
                function initMap(){
                    var latlng = { lat:40.589493, lng:-75.603426 };
                var map = new google.maps.Map(document.getElementById('map', {
                    center: latlng,
                        zoom: 8,

                }));
                var marker = new google.maps.Marker({
                    position: latlng,
                    map: map
                });
                marker.addListener('click', function() {
                        infowindow.open(map, marker);
                    });
                }
            </script>

            <script async defer src="https://maps.googleapis.com/maps/api/js?key=API_KEY&callback=initMap"></script>

函数initMap（）{
var latlng={lat:40.589493，lng:-75.603426}；
var map=new google.maps.map（document.getElementById（'map'）{
中心：拉特林，
缩放：8，
}));
var marker=new google.maps.marker({
位置：latlng，
地图：地图
});
marker.addListener（'click'，function（））{
信息窗口。打开（地图、标记）；
});
}

---

确保地图分区的高度和宽度正确

<div class="col">
    <div id="map" style='width: 400px; height: 400px;'></div>
</div>

控制台中是否有任何错误？没有。只有当我双击地图时，控制台中才会出现以下错误：未捕获类型错误：无法读取htmldevelment.Wm.F.udm.Dm.Pa（common.js:63）onClick@map.js:11 Wm.F.udm.Pa@common.js:63中Object.onClick（map.js:11）的null属性“缩放”