如何将谷歌自动完成结果仅限于城市和国家

IT技术 javascript autocomplete google-maps-api-3
2021-01-17 15:57:48

我正在使用谷歌自动完成地方 javascript 为我的搜索框返回建议的结果，我需要的是只显示与输入的字符相关的城市和国家，但谷歌 api 会给出很多我不需要的一般地点结果，那么如何将结果限制为仅显示城市和国家。

我正在使用以下示例：

<html>
<head>
<style type="text/css">
   body {
         font-family: sans-serif;
         font-size: 14px;
   }
</style>

<title>Google Maps JavaScript API v3 Example: Places Autocomplete</title>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places" type="text/javascript"></script>
<script type="text/javascript">
   function initialize() {
      var input = document.getElementById('searchTextField');
      var autocomplete = new google.maps.places.Autocomplete(input);
   }
   google.maps.event.addDomListener(window, 'load', initialize);
</script>

</head>
<body>
   <div>
      <input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on">
   </div>
</body>
</html>
6个回答

你可以试试国家限制

function initialize() {

 var options = {
  types: ['(cities)'],
  componentRestrictions: {country: "us"}
 };

 var input = document.getElementById('searchTextField');
 var autocomplete = new google.maps.places.Autocomplete(input, options);
}

更多信息：

ISO 3166-1 alpha-2可用于将结果限制为特定组。目前，您可以使用 componentRestrictions 按国家/地区过滤。

国家/地区必须作为两个字符传递，与 ISO 3166-1 Alpha-2 兼容的国家/地区代码。

官方指定的国家代码

现在是 2014 年 8 月。是否已经可以只显示国家和城市？例如，当我输入 Mil 时，结果是 Milan, Bergamo, Italy。我只需要意大利米兰。一个一个地添加所有国家不是一种选择。
2021-03-23 15:57:48
是否可以指定多个国家？
2021-03-31 15:57:48
如果我们使用 types: ['(cities)'] 那么我们将不允许我们在这里通过邮政编码进行搜索。
2021-03-31 15:57:48
@bart 显然这是不可能的。如果您想要该功能，请在此问题上加注星标。
2021-04-04 15:57:48
如果我没有加载任何地图，您知道自动完成查询是否有任何使用限制吗？我知道加载地图有 25,000 次使用限制
2021-04-06 15:57:48 

<html>
<head>
<style type="text/css">
   body {
         font-family: sans-serif;
         font-size: 14px;
   }
</style>

<title>Google Maps JavaScript API v3 Example: Places Autocomplete</title>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script>
<script type="text/javascript">
   function initialize() {
      var input = document.getElementById('searchTextField');
      var options = {
        types: ['geocode'] //this should work !
      };
      var autocomplete = new google.maps.places.Autocomplete(input, options);
   }
   google.maps.event.addDomListener(window, 'load', initialize);
</script>

</head>
<body>
   <div>
      <input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on">
   </div>
</body>
</html>

var options = {
  types: ['geocode'] //this should work !
};
var autocomplete = new google.maps.places.Autocomplete(input, options);

对其他类型的引用：http : //code.google.com/apis/maps/documentation/places/supported_types.html#table2

直接从谷歌检查此代码。他们制作了一个过滤示例code.google.com/apis/maps/documentation/javascript/...
2021-03-22 15:57:48
相同的参数是否适用AutocompleteService？
2021-03-22 15:57:48
自动完成对象不接受两个变量，只能接受一个变量，即“地理编码”。我不知道如何解决这个问题。谷歌文档列出了很多类型，但没有一个可以被接受。
2021-03-27 15:57:48

弗朗索瓦给出的答案会列出一个国家的所有城市。但是，如果要求列出一个国家/地区的所有地区（城市 + 州 + 其他地区等）或该国家/地区的机构，您可以通过更改类型来相应地过滤结果。

仅列出该国的城市 

 var options = {
  types: ['(cities)'],
  componentRestrictions: {country: "us"}
 };

列出全国所有城市、州和地区

 var options = {
  types: ['(regions)'],
  componentRestrictions: {country: "us"}
 };

列出所有机构——例如该国的餐馆、商店和办公室

  var options = {
      types: ['establishment'],
      componentRestrictions: {country: "us"}
     };

更多信息和选项，请访问

https://developers.google.com/maps/documentation/javascript/places-autocomplete

希望这可能对某人有用

试试这个 

<html>
<head>
<style type="text/css">
   body {
         font-family: sans-serif;
         font-size: 14px;
   }
</style>

<title>Google Maps JavaScript API v3 Example: Places Autocomplete</title>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places&region=in" type="text/javascript"></script>
<script type="text/javascript">
   function initialize() {
      var input = document.getElementById('searchTextField');
      var autocomplete = new google.maps.places.Autocomplete(input);
   }
   google.maps.event.addDomListener(window, 'load', initialize);
</script>

</head>
<body>
   <div>
      <input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on">
   </div>
</body>
</html>

http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places " type="text/javascript"

将其更改为：“region=in”（in=india）

" http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places®ion=in " type="text/javascript"

这应该是公认的答案。达到OP要求的结果的最简单，最快的方法。它对我有用。
2021-03-15 15:57:48
我们需要城市列表、州列表、地区列表等等
2021-03-30 15:57:48

与接受的答案基本相同，但更新了新类型和多个国家/地区的限制：

function initialize() {

 var options = {
  types: ['(regions)'],
  componentRestrictions: {country: ["us", "de"]}
 };

 var input = document.getElementById('searchTextField');
 var autocomplete = new google.maps.places.Autocomplete(input, options);
}

使用'(regions)'代替'(cities)'允许按邮政编码和城市名称搜索。

参见官方文档，表 3：https : //developers.google.com/places/supported_types

我花了 5 分钟才弄清楚它的'(regions)'类型，而不是'regions'......
2021-03-14 15:57:48
其它你可能感兴趣的问题
上一篇nodeValue 与 innerHTML 和 textContent。如何选择？ 下一篇Moment js 日期时间对比