变得断断续续'谷歌没有定义'以及使用map-apiv3的其他错误

Getting intermittent 'google not defined' and other errors using maps api v3

本文关键字:map-apiv3 错误 其他 断断续续 谷歌 定义      更新时间:2024-02-28

我的应用程序对人口普查进行api调用,并将该数据与Google Maps api v3结合使用。它大部分时间都按预期工作,但我在没有任何明显原因的情况下收到了"Initmap未定义"、"google未定义"或"TypeError:map.data.getFeatureById(…)未定义"的间歇性错误
HTML:

<html>
    <head> 
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
   <script src="https://maps.googleapis.com/maps/api/js?v=3&key=KEY1234&callback=initMap" async defer
    ></script>
         <script src="js/mapfunc.js"></script>         
    </head>
    <body>    
            <div id="map"></div>
<script>var map;
function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
        zoom: 4,
        center: {lat: 35, lng: -106}
    });
}</script> 
    </body>
</html>

JS:

function loadMapShapes() {
    map.data.loadGeoJson('jsonya2.geojson', { idPropertyName: 'STATE' });
    variable = 'B01003_001E,NAME';  
    variable2 = ',B01001F_002E';     
    loadCensusData(variable);
}
function loadCensusData(variable) {
    // load the requested variable from the census API
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://api.census.gov/data/2014/acs5/?get=' +
    variable + '&for=state:*&key=KEY123');
    xhr.onload = function() {
        var censusData = JSON.parse(xhr.responseText);
        censusData.shift(); // the first row contains column names           
        censusData.forEach(function(row) { 
            censusMin = 0;
        censusMax = 36000000;
            var censusVariable = parseFloat(row[0]);             
            var stateName = row[1];
            var stateId = row[2];  
            // keep track of min and max values
            if (censusVariable < censusMin) {
              censusMin = censusVariable;
            }
            if (censusVariable > censusMax) {
              censusMax = censusVariable;
            }
            // update the existing row with the new data            
            coolid = map.data.getFeatureById(stateId);// <-- Here's where 
//I get the error most often: "TypeError: map.data.getFeatureById(...) is undefined"
            if (coolid !== undefined) {
                  map.data
        .getFeatureById(stateId)
        .setProperty('census_variable', censusVariable);
                map.data
        .getFeatureById(stateId)
        .setProperty('census_variable1', stateName);
            }
            coolstate = map.data.getFeatureById(stateName);

        });

同样,这段代码可能有40%的时间有效,其余时间会抛出上述错误之一。我可能注意到白天的错误增加了,但不能确定。

非常感谢您的想法,这里有一个链接,指向带有人口普查和谷歌地图API调用的此代码的实时版本:http://dukecitydigital.com/c1/

loadGeoJson异步运行,使用loadGeoJson的回调来执行更多的函数,这些函数取决于loadGeoJson:的结果

function loadMapShapes() {
  variable = 'B01003_001E,NAME';  
  variable2 = ',B01001F_002E'; 
  map.data.loadGeoJson('jsonya2.geojson', { idPropertyName:'STATE'}, function(){
    loadCensusData(variable);
  });
}

以下是我用来避免"未定义"错误的代码:

// update the existing row with the new data
if (typeof(map.data.getFeatureById(stateId)) != "undefined") {
  map.data
    .getFeatureById(stateId)
    .setProperty('census_variable', censusVariable);
}