Google地图有时无法加载

Question

有人可以快速查看我的代码,并协助修复谷歌地图不随机加载的问题？我在这里看了很多线程并尝试过很多东西,但仍然没有结果.谢谢!

在页面上映射容器:

 <div id="google-map" class="" data-latitude="34.0090633" data-longitude="-118.49310960000003" data-wow-duration="" data-wow-delay=""></div>

页面底部的脚本:

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

外部.js文件中的脚本:

var latitude = $('#google-map').data('latitude')
var longitude = $('#google-map').data('longitude')
function initialize_map() {
    var myLatlng = new google.maps.LatLng(latitude,longitude);
    var mapOptions = {
        zoom: 14,
        scrollwheel: false,
        center: myLatlng
    };
    var map = new google.maps.Map(document.getElementById('google-map'), mapOptions);
    var contentString = '';
    var infowindow = new google.maps.InfoWindow({
        content: '<div class="map-content"><ul class="address">' + $('.address').html() + '</ul></div>'
    });
    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map,marker);
    });
}
google.maps.event.addDomListener(window, 'load', initialize_map);

Answer 1

这可能是因为您正在使用

<script async defer

您的脚本在尚未加载Google脚本时开始执行.它有时会运行,因为它变成了概率游戏.当您的Google脚本早期加载时,它可以正常工作 - 如果没有,则分页.