如何使用 Google Maps API 从 Places 中获取一致的 City、State 和 Country 值？ [复制]

Question

期望的行为

从自动填充搜索框结果中选择地点后，能够检索城市、州（地区）和国家/地区值。

实际行为

似乎每个Place 在其address_components 数组中可能有不同数量的值，因此无法通过它们在数组中的位置直接引用城市、州和国家。

问题

是否有一个既定的惯例可以轻松地从 Places 中获得一致的 City、State 和 Country 值？

我开始创建一个嵌套循环来检查address_components 数组值中的types 值，但感觉工作量太大，而且似乎types 数组中的值不需要是唯一的，例如type > political 可以在address_components 数组中出现多次。

我的尝试

相关代码

<script src="https://maps.googleapis.com/maps/api/js?key=********&libraries=places"></script>

// restrict search results to the 'cities' type
// see:  https://developers.google.com/places/supported_types?csw=1#table3
var options = {
    types: ['(cities)']
};

// create autocomplete
const autocomplete = new google.maps.places.Autocomplete(input, options);

// do stuff when selecting a search result
autocomplete.addListener("place_changed", () => {

const place = autocomplete.getPlace();

console.log("here is the place!");
console.log(place);

}); 

我认为我可以像这样获得城市、州（地区）和国家/地区值：

var place_city = place.name;
var place_region = place.address_components[1].long_name;
var place_country = place.address_components[2].short_name;

但是，以下示例显示，地点可能具有结构不同的 address_components 属性：

搜索词：Townsville QLD, Australia

返回 address_components 作为 4 个值的数组 - 国家作为第 4 个值包含在内：

[
  {
    "long_name": "Townsville",
    "short_name": "Townsville",
    "types": [
      "colloquial_area",
      "locality",
      "political"
    ]
  },
  {
    "long_name": "Townsville City",
    "short_name": "Townsville",
    "types": [
      "administrative_area_level_2",
      "political"
    ]
  },
  {
    "long_name": "Queensland",
    "short_name": "QLD",
    "types": [
      "administrative_area_level_1",
      "political"
    ]
  },
  {
    "long_name": "Australia",
    "short_name": "AU",
    "types": [
      "country",
      "political"
    ]
  }
]

搜索词：Brisbane QLD, Australia

返回 address_components 作为 3 个值的数组 - 国家作为第三个值包含：

[
  {
    "long_name": "Brisbane",
    "short_name": "Brisbane",
    "types": [
      "colloquial_area",
      "locality",
      "political"
    ]
  },
  {
    "long_name": "Queensland",
    "short_name": "QLD",
    "types": [
      "administrative_area_level_1",
      "political"
    ]
  },
  {
    "long_name": "Australia",
    "short_name": "AU",
    "types": [
      "country",
      "political"
    ]
  }
]

搜索词：Acton Park TAS, Australia

返回 address_components 作为 5 个值的数组 - 国家作为第 4 个值包含：

[
  {
    "long_name": "Acton Park",
    "short_name": "Acton Park",
    "types": [
      "locality",
      "political"
    ]
  },
  {
    "long_name": "Clarence City Council",
    "short_name": "Clarence City",
    "types": [
      "administrative_area_level_2",
      "political"
    ]
  },
  {
    "long_name": "Tasmania",
    "short_name": "TAS",
    "types": [
      "administrative_area_level_1",
      "political"
    ]
  },
  {
    "long_name": "Australia",
    "short_name": "AU",
    "types": [
      "country",
      "political"
    ]
  },
  {
    "long_name": "7170",
    "short_name": "7170",
    "types": [
      "postal_code"
    ]
  }
]

Answer 1

正如在原始帖子中评论的那样，似乎还有其他问题可以解决这个问题。

如果它对其他人有帮助，那么熟悉这里的内容对我很有帮助：

Address types and address component types

该链接不仅列出了不同的types，还提供了对每个含义的解释。

在我的情况下，我得出了一个希望是正确的结论，即我主要对这些类型感兴趣：

• 地点（对于“城市”）
• administrative_area_level_1（代表“州”）
• 国家（代表“国家”）

我对新手友好的嵌套循环的初稿是：

var city = "";
var state = "";
var country = "";

$.each(my_place, function(index_1, value_1) {

    var types = value_1.types;

    $.each(types, function(index_2, value_2) {
        if (value_2 === "locality") {
            city = my_place[index_1]['long_name'];
        } else if (value_2 === "administrative_area_level_1") {
            state = my_place[index_1]['long_name'];
        } else if (value_2 === "country") {
            country = my_place[index_1]['short_name'];
        }
    });

});

console.log("city: " + city);
console.log("state: " + state);
console.log("country: " + country);

在 OP 中的每个 address_components 数组上进行测试时，它似乎都有效。

正如 cmets 中所指出的，似乎有更复杂的解决方案 here 和 here。