Question

我创建了一个包含多个标记的Google地图。对于管理，我根据地点ID创建了一个数组，以显示不同兴趣点的详细信息。问题是从第十个数组中不再显示细节。我使用免费的Google API。在getService的管理中是否有偶然的限制？我做错什么了吗？下面是图片和代码！

var paris = [
  ['Le Palais de l&apos;Élysée', 48.8704156, 2.3167538999999806, {placeId: 'ChIJR-OmjM5v5kcRIi9Yekb0OC4'}],
  ['Rue du Faubourg Saint-Honoré', 48.8729217, 2.3104977000000417, {placeId: 'ChIJ9UXDFMZv5kcRJM1tqvbRfjY'}],
  ['Champs Élysées', 48.8657844, 2.307314099999985, {placeId: 'ChIJMXZjGMVv5kcRmVlGwtKSa3w'}],
  ['Arc de triomphe', 48.8737793, 2.2950155999999424, {placeId: 'ChIJazhtdOxv5kcRqV9clsepEIc'}],
  ['Musée du Louvre', 48.8606111, 2.3376439999999548, {placeId: 'ChIJD3uTd9hx5kcR1IQvGfr8dbk'}],
  ['Grand Palais', 48.86610909999999, 2.3124543999999787, {placeId: 'ChIJ0dzuSNBv5kcRa6BHUVdFm0k'}],
  ['Place de la Concorde', 48.8656331, 2.3212356999999884, {placeId: 'ChIJAQquYc1v5kcRLKslDuENAxg'}],
  ['L&apos;eglise de la Madeleine', 48.8700435, 2.324550199999976, {placeId: 'ChIJ7xwB9TJu5kcRtsJIlPxT918'}],
  ['Grande Roue de Paris', 48.8651962, 2.3220541000000594, {placeId: 'ChIJCfZJWc1v5kcRg_05SQL-RNg'}],
  ['8e arrondissement', 48.87187219999999, 2.3176432000000204, {placeId: 'ChIJdWkEFsZv5kcRwBqUaMOCCwU'}],
  ['Gare Saint-Lazare', 48.8763827, 2.325446800000009, {placeId: 'ChIJgwCdnTVu5kcRADA9YHBZa1s'}],
  ['Jardin des Tuileries', 48.8634916, 2.327494300000012, {placeId: 'ChIJAQAAMCxu5kcRx--_4QnbGcI'}],
  ['Hotel Splendide Royal Paris', 48.87096269999999, 2.315414099999998]
];

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: {lat: paris[0][1], lng: paris[0][2]}
  });

  setMarkers(map);
  var infowindow = new google.maps.InfoWindow();
  var service = new google.maps.places.PlacesService(map);


  for(var i=0; i < 12; i++){
    service.getDetails(paris[i][3], function(place, status) {
      if (status === google.maps.places.PlacesServiceStatus.OK) {
        var marker = new google.maps.Marker({
          map: map,
          position: place.geometry.location
        });
        google.maps.event.addListener(marker, 'click', function() {
          infowindow.setContent( "<strong>" + place.name + "</strong>" +
            "<br />" + place.formatted_address +
            "<br />" + "<a target='_blank' href='"+ place.website + "'>" + place.website +"</a>" +
            "<br />" + "Tel: " + place.international_phone_number
          );
          infowindow.open(map, this);
        });
      }
    });
  }
}

function setMarkers(map) {
  for (var i = 0; i < paris.length; i++) {
    var strut = paris[i];
    var marker = new google.maps.Marker({
      position: {lat: strut[1], lng: strut[2]},
      map: map,
      title: strut[0]
    });
  }
}

Answer 1

Javascript API服务的配额已针对响应人工交互进行了优化。建议不要使用客户端服务进行批量查询。

当API加载时，最多可以提前10个请求，但之后有一个速率限制，当有一个人类输入地址时就足够了，但是当有代码试图对越来越多的地址进行地理编码时

为了一次获得超过10个结果，您需要在加载地图之前使用Geocoding API Web服务，以批量对所有结果进行地理编码。如果您的地图将这些结果显示给许多用户，这是特别合适的。

或者，您可以对结果进行分页（每页10个），并在页面之间强制延迟，或者为每个页面重新加载API。这两种方法都有其缺点：延迟对用户来说很烦人，重新加载API的速度较慢，并且更快地消耗了Maps JavaScript API配额。也就是说，如果您确实希望用户经常超越第一页。

也许你可以用一个漂亮的动画加载前10个，然后等待10秒，从这一刻开始以0.8 QPS（每秒查询数）左右加油，并包含一些不让用户感到无聊的动画:)

Answer 2

很可能是因为您获得剩余两个请求的OVER_QUERY_LIMIT状态代码。

根据Status Codes

OVER_QUERY_LIMIT表示您已超过配额。

根据Usage limits

Google商家信息搜索服务共享相同的使用限制。但是，文本搜索服务需要10倍的乘数。也就是说，您所做的每个文本搜索请求都将计为10 针对您的配额的请求

为了绕过此限制，您可以考虑以下解决方案：一旦收到OVER_QUERY_LIMIT状态，等待某个延迟然后再次执行请求，在这种情况下可以请求所有位置。

示例

＆＃13;

var paris = [
  ['Le Palais de l&apos;Élysée', 48.8704156, 2.3167538999999806, { placeId: 'ChIJR-OmjM5v5kcRIi9Yekb0OC4' }],
  ['Rue du Faubourg Saint-Honoré', 48.8729217, 2.3104977000000417, { placeId: 'ChIJ9UXDFMZv5kcRJM1tqvbRfjY' }],
  ['Champs Élysées', 48.8657844, 2.307314099999985, { placeId: 'ChIJMXZjGMVv5kcRmVlGwtKSa3w' }],
  ['Arc de triomphe', 48.8737793, 2.2950155999999424, { placeId: 'ChIJazhtdOxv5kcRqV9clsepEIc' }],
  ['Musée du Louvre', 48.8606111, 2.3376439999999548, { placeId: 'ChIJD3uTd9hx5kcR1IQvGfr8dbk' }],
  ['Grand Palais', 48.86610909999999, 2.3124543999999787, { placeId: 'ChIJ0dzuSNBv5kcRa6BHUVdFm0k' }],
  ['Place de la Concorde', 48.8656331, 2.3212356999999884, { placeId: 'ChIJAQquYc1v5kcRLKslDuENAxg' }],
  ['L&apos;eglise de la Madeleine', 48.8700435, 2.324550199999976, { placeId: 'ChIJ7xwB9TJu5kcRtsJIlPxT918' }],
  ['Grande Roue de Paris', 48.8651962, 2.3220541000000594, { placeId: 'ChIJCfZJWc1v5kcRg_05SQL-RNg' }],
  ['8e arrondissement', 48.87187219999999, 2.3176432000000204, { placeId: 'ChIJdWkEFsZv5kcRwBqUaMOCCwU' }],
  ['Gare Saint-Lazare', 48.8763827, 2.325446800000009, { placeId: 'ChIJgwCdnTVu5kcRADA9YHBZa1s' }],
  ['Jardin des Tuileries', 48.8634916, 2.327494300000012, { placeId: 'ChIJAQAAMCxu5kcRx--_4QnbGcI' }],
  //['Hotel Splendide Royal Paris', 48.87096269999999, 2.315414099999998]
];


function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: {lat: paris[0][1], lng: paris[0][2]}
  });

  //setMarkers(map);
  var infowindow = new google.maps.InfoWindow();
  var service = new google.maps.places.PlacesService(map);
  displayPlaces(map,service,infowindow,paris);
}


function displayPlaces(map,service,infowindow,data,currentIndex){
  
  currentIndex = currentIndex || 0;
  if(currentIndex >= data.length)
      return;

  service.getDetails(data[currentIndex][3], function(place, status) {
      
      if (status === google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
          console.log(status + currentIndex);
          setTimeout(function() {
              displayPlaces(map,service,infowindow,data,currentIndex);
          }, 200);
      }      
      else if (status === google.maps.places.PlacesServiceStatus.OK) {
        var marker = new google.maps.Marker({
          map: map,
          position: place.geometry.location
        });
        google.maps.event.addListener(marker, 'click', function() {
          infowindow.setContent( "<strong>" + place.name + "</strong>" +
            "<br />" + place.formatted_address +
            "<br />" + "<a target='_blank' href='"+ place.website + "'>" + place.website +"</a>" +
            "<br />" + "Tel: " + place.international_phone_number
          );
          infowindow.open(map, this);
        });

        currentIndex++;
        displayPlaces(map,service,infowindow,data,currentIndex);

      }
    });
}



google.maps.event.addDomListener(window, 'load', initMap);

＆＃13;

 #map,
        html,
        body {
            padding: 0;
            margin: 0;
            height: 100%;
        }

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="map"></div>

＆＃13;

谷歌地图：超过10的地方ID数组不起作用

2 个答案: