得到间歇性的谷歌未定义'和使用maps api v3的其他错误

时间:2016-04-08 06:58:55

标签: javascript google-maps google-maps-api-3

我的应用程序对人口普查进行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/

2 个答案:

答案 0 :(得分:2)

loadGeoJson以异步方式运行,使用loadGeoJson的回调来执行依赖于loadGeoJson结果的其他函数:

function loadMapShapes() {
  variable = 'B01003_001E,NAME';  
  variable2 = ',B01001F_002E'; 

  map.data.loadGeoJson('jsonya2.geojson', { idPropertyName:'STATE'}, function(){
    loadCensusData(variable);
  });
}

答案 1 :(得分:1)

以下是我使用的代码,以避免&#39; undefined&#39;错误:

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