Google AutocompleteService不返回某些城市的结果

Question

我正在开发Angular 6应用程序

我发现Google自动填充功能无法为有效输入返回正确的值。

当我为某些城市调用API时，它返回ZERO_RESULTS，或者只是忽略调用告诉我有关指定输入的函数。

这些城市：

  

Niš，Nisko，Görlitz

即使它适用于其他地方。

这是我的代码：

        const firstResult = $('.pac-container .pac-item:first').text(); //returns 'NiskoPolska' 
        console.log(firstResult);
        const autoCompleteService = new google.maps.places.AutocompleteService();
        const placesService = new google.maps.places.PlacesService(self.searchPlacesRef.nativeElement);

        autoCompleteService.getPlacePredictions({ input: firstResult }, function (results, status) {
          if (status == google.maps.places.PlacesServiceStatus.OK) {
            placesService.getDetails({ placeId: results[0].place_id }, function (result, stat) {
              if (stat == google.maps.places.PlacesServiceStatus.OK) {
               console.log(result);
              }
            });
          }
        });

有人可以告诉我在某些城市不起作用的原因是什么？

Answer 1

我可以看到您正在使用来自Google Maps JavaScript API的地方自动完成服务。您仅使用input参数，这意味着您正在全局搜索并且没有应用任何类型过滤器。当您进行全局搜索时，将仅返回与您的文本匹配的最突出的功能。例如，如果您按照我的示例https://jsfiddle.net/xomena/xqLk0atz/所示搜索“Niš”，则会得到以下预测

如果您只打算搜索城市，则可以在自动完成请求中添加类型过滤器，如https://jsfiddle.net/xomena/2qs53dgx/所示。在这种情况下，您将在全球范围内获得以下预测

如您所见，这次Niš是第二个预测，但是您的代码仅依赖于此列表中的第一个结果。我认为这不是正确的假设。 Nisku在全球范围内可能会更加突出，因此您不应该期望Niš成为第一个要素。

如果您在自动完成请求中提供了区域偏差，则可以改善结果列表。例如，如果您对欧洲城市感兴趣，则将位置和半径参数添加到欧洲偏见中。我在https://jsfiddle.net/xomena/rmsLvgyx/中做到了。这次Niš是第一个可能与您的代码正确配合的预测。

这是我最后一个将Niš作为第一个预测的代码段

function initService() {
  var displaySuggestions = function(predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK) {
      alert(status);
      return;
    }

    predictions.forEach(function(prediction) {
      var li = document.createElement('li');
      var icon_url = "https://maps.gstatic.com/mapfiles/place_api/icons/geocode-71.png"; 

      var icon = document.createElement("IMG");
      icon.src = icon_url;
      icon.width = 24;
      icon.height = 24;
      li.appendChild(icon);
      li.appendChild(document.createTextNode(prediction.description));
      document.getElementById('results').appendChild(li);
    });
  };

  var service = new google.maps.places.AutocompleteService();
  service.getPlacePredictions({ 
    input: 'Niš',
    types: ['(cities)'],
    location: new google.maps.LatLng(49.18004,13.554544),
    radius: 1000000
  }, displaySuggestions);
}

#map {
  height: 100%;
}
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#right-panel {
  font-family: 'Roboto','sans-serif';
  line-height: 30px;
  padding-left: 10px;
}

#right-panel select, #right-panel input {
  font-size: 15px;
}

#right-panel select {
  width: 100%;
}

#right-panel i {
  font-size: 12px;
}

<div id="right-panel">
  <p>Query suggestions for 'Niš':</p>
  <ul id="results"></ul>
</div>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&libraries=places&callback=initService"
        async defer></script>

我希望这些示例能够说明自动完成服务的工作方式，以及该服务的视口偏差有多重要。