简体   繁体   English

JavaScript HTML Google Maps API地理编码服务问题

[英]JavaScript HTML Google Maps API geocoding service Issue

I am attempting to plot multiple addresses using google maps api. 我正在尝试使用Google Maps API绘制多个地址。 I am having an issue returning the location value from the geocoding service for anything more that 11 test addresses. 我在从地理编码服务返回11个测试地址以外的其他位置时遇到问题。 The test addresses return valid latlng values individually. 测试地址分别返回有效的latlng值。 My provided sample code will run, but when address[11] is not commented out it will not. 我提供的示例代码将运行,但是当address [11]未注释掉时,它将不会运行。

var geocoder;
var map;
var counter = -1;
  var address = [];
  address [0] = {loc:'memphis tn', pop:5};
  address [1] = {loc:'125 ketay', pop:2};
  address [2] = {loc:'tenafly nj', pop:4};
  address [3] = {loc:'california', pop:3};
  address [4] = {loc:'kansas city', pop:1};
  address [5] = {loc:'lake erie', pop:1};
  address [6] = {loc:'chicago', pop:1};
  address [7] = {loc:'oregon', pop:1};
  address [8] = {loc:'idaho', pop:1};
  address [9] = {loc:'nevada', pop:1};
  address [10] = {loc:'georgia', pop:1};
  //address [11] = {loc:'Las Vegas', pop:1};

var k = 0;
function initialize() {
  geocoder = new google.maps.Geocoder();
  var latlng = new google.maps.LatLng(-34.397, 150.644);
  var mapOptions = {
    zoom: 5,
    center: latlng
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);


 for (k = 0; k < address.length; k++){
  geocoder.geocode( {'address': address[k].loc}, function(results) {
  counter ++;
      map.setCenter(results[0].geometry.location);

 var cir = new google.maps.Circle({
      strokeColor: '#FF0000',
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: '#FF0000',
      fillOpacity: 0.35,
      map: map,
      center: results[0].geometry.location,
      radius: address[counter].pop * 100000
  });

  });
}
}

google.maps.event.addDomListener(window, 'load', initialize);

It looks like Google is punishing you for having calls come in too fast. Google似乎因为您打入电话太快而在惩罚您。 It must think you are spamming the API. 它必须认为您是在向API发送垃圾邮件。 I modified you're code example and added a 250 ms delay between google API calls and it works fine. 我修改了您的代码示例,并在Google API调用之间添加了250毫秒的延迟,效果很好。 You can play with how short of a delay will work. 您可以玩延迟多短的游戏。

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&libraries=places"></script>
<script>
var geocoder;
var map;
var counter = -1;
  var address = [];
  address [0] = {loc:'memphis tn', pop:5};
  address [1] = {loc:'125 ketay', pop:2};
  address [2] = {loc:'tenafly nj', pop:4};
  address [3] = {loc:'california', pop:3};
  address [4] = {loc:'kansas city', pop:1};
  address [5] = {loc:'lake erie', pop:1};
  address [6] = {loc:'chicago', pop:1};
  address [7] = {loc:'oregon', pop:1};
  address [8] = {loc:'idaho', pop:1};
  address [9] = {loc:'nevada', pop:1};
  address [10] = {loc:'georgia', pop:1};
  address [11] = {loc:'Las Vegas', pop:1};

var k = 0;
function initialize() {
  geocoder = new google.maps.Geocoder();
  var latlng = new google.maps.LatLng(-34.397, 150.644);
  var mapOptions = {
    zoom: 5,
    center: latlng
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);


 for (k = 0; k < address.length; k++){

 //alert( address[k].loc );
  geocoder.geocode( {'address': address[k].loc}, function(results) { setTimeout( function(){
  counter ++;
      map.setCenter(results[0].geometry.location);

 var cir = new google.maps.Circle({
      strokeColor: '#FF0000',
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: '#FF0000',
      fillOpacity: 0.35,
      map: map,
      center: results[0].geometry.location,
      radius: address[counter].pop * 100000
  });
  }, 250 )
  });
}
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
<body>
<div id='map-canvas' style='width: 700px; height: 600px'>
</div>
</body>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM