在随机电脑上刷新后 Google Map API 未加载答案

【问题标题】：Google Map API not loading after refreshing on random pc在随机电脑上刷新后 Google Map API 未加载
【发布时间】：2018-08-22 10:57:11
【问题描述】：

即使我刷新页面或硬刷新它，谷歌地图也能在我的电脑上很好地加载，但是当有些人访问它时，刷新地图所在的页面后它不会加载。我不认为这是加载问题的页面，因为我已经使用此代码解决了该问题

//---This condition traps google map API loading conflict with the page onload
if(isPageLoaded){
    //--Executes directly if page has already been loaded
    initializeMap($scope, $timeout, $cookies, $pageViewCtrl);
}else{
    //--If page was not yet loaded, Waits for the page to be ready, then initialize map
    document.addEventListener('readystatechange', function docStateChange(e) {

        if (e.target.readyState == 'complete') {
            e.target.removeEventListener('readystatechange', docStateChange);

            //console.log("Page is ready.");
            initializeMap($scope, $timeout, $cookies, $pageViewCtrl);

            isPageLoaded = true;
        }
    });
}

内部初始化地图

function initializeMap($scope, $timeout, $cookies, $pageViewCtrl)
{
    var branchlong, branchlat;
    branchlong = $cookies.get(LONGITUDE);
    branchlat = $cookies.get(LATITUDE);

    geocoder = new google.maps.Geocoder();
    map = new google.maps.Map(document.getElementById("map"),
        {
            zoom: 13,
            center: new google.maps.LatLng(parseFloat(branchlat),parseFloat(branchlong)),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: false,
            fullscreenControl: false
        });

    google.maps.event.addListenerOnce(map, 'idle', function(){
        // do something only the first time the map is loaded
        isMapInitialized = true;
    });

    google.maps.event.addListener(map.getStreetView(),'visible_changed',function(){
        //Street View listener codes here
    });
};

我做了一些观察。我让我的其他队友访问该页面并刷新它。有些负载好，有些负载不好。知道为什么会这样吗？

【问题讨论】：

标签： angularjs google-maps google-maps-api-3

【解决方案1】：

好的，看来问题出在 eventlistener readystatechange 上。它没有在某些浏览器上触发。

我所做的是我使用了一种更简单的方法。在我的控制器中，我将代码放入 scope

$scope.mapInitiator = function() {
  initializeMap($scope, $timeout, $cookies, $pageViewCtrl);
}

然后在我的 HTML 中

<div id="map" ng-init="mapInitiator()"></div>

【讨论】：