谷歌地点自动完成 API 获取城镇和地区 (JavaScript)

Question

我认为这是一个新问题，我有一些示例代码。

谷歌地点自动完成 API 的代码是：

      function initialize() {
        var input = document.getElementById('searchField');
        var options = {
        componentRestrictions: {
        country: ['uk', 'ie']
        }
      };
      var autocomplete = new google.maps.places.Autocomplete(input, options);
      google.maps.event.addListener(autocomplete, 'place_changed', 
      function() {
         var place = autocomplete.getPlace();
         var placeStreet = autocomplete.getPlace()[0];
         var place_ = place.name;
         var lat_ = place.geometry.location.lat();
         var long_ = place.geometry.location.lng();
         alert(place + ", street:  " + placeStreet + ", " + place_ + ", " + 
         lat_ + ", " + long_);

       });
     }

我如何获得城镇或地区或国家。 由于我来自英国，因此我需要检测伦敦、地区或县 = Middlesex 和国家 = 英国等城镇。 有没有办法做到这一点？ 以及如何找到 getPlace() 的打印输出 如何打印出 Javascript 对象。

提前致谢

***EDIT JSON.stringify(autocomplete.getPlaces()) 打印出对象，但我如何提取城镇、地区、国家等。

*** 编辑在我的自动完成中，我的 json 对象以不同的顺序打印出对象，因此找到第三个对象将是邮政城镇或行政区域。 如何按类型搜索并获取类型国家和国家或类型 postal_town 和城镇。 我的 json 输出是：

1)

     {
      "address_components": [
      {
      "long_name": "12-20",
      "short_name": "12-20",
      "types": [
       "street_number"
      ]
      },
      {
      "long_name": "Wood Street",
      "short_name": "Wood St",
      "types": [
       "route"
       ]
      },
      {
       "long_name": "Walthamstow",
        "short_name": "Walthamstow",
        "types": [
        "neighborhood",
        "political"
       ]
     },
     {
      "long_name": "London",
      "short_name": "London",
       "types": [
       "postal_town"
      ]
      }, etc

2)

 {
    "address_components": [
    {
     "long_name": "London",
      "short_name": "London",
     "types": [
      "locality",
      "political"
    ]
   },
   {
  "long_name": "London",
  "short_name": "London",
  "types": [
    "postal_town"
  ]
    },
     {
        "long_name": "Greater London",
        "short_name": "Greater London",
        " types": [
        "administrative_area_level_2",
       "political"
     ]
     },

Answer 1

我不确定您所说的城镇和地区是什么意思，但您可以像我一样尝试以下操作来获取选定地点的城市和州

对于城镇，您可以尝试： locality或sublocality_level_1属性。如果locality没有返回结果，请使用sublocality_level_1 ，我建议两者都尝试

对于区域，您可以尝试： administrative_area_level_1

和国家使用： country

这是 api 文档： 放置自动完成 api 文档

更新 ：

这是你应该做的：

1.首先你应该从响应中获取address_component

    var place = autocomplete.getPlace().address_components

    //it will give you an array of objects which has a type property.This type property holds different components of your address.Loop through it to get your desired component

    address_component = [
      {
        "long_name" : "Australia",
        "short_name": "Aus",
        "types" : ["country"]
      },
      {
        "long_name" : "Pyrmont",
        "short_name" : "Pyrmont",
        "types" : [ "locality", "political" ]
      },
      {
        "long_name" : "Council of the City of Sydney",
        "short_name" : "Sydney",
        "types" : [ "administrative_area_level_2", "political" ]
      },
      {
        "long_name" : "New South Wales",
        "short_name" : "NSW",
        "types" : [ "administrative_area_level_1", "political" ]
      }

]

您将遍历并找到您需要的类型并获取 short_name 或 long_name 并将其显示在屏幕上。如果您理解这一点，您就可以开始了。如果没有，您可以问我。检查所有可用的组件 位置详细信息

代码：

声明一个组件映射，它将容纳您只想使用的组件

   var componentMap = {
        country: 'country',
        locality: 'locality',
        administrative_area_level_1 : 'administrative_area_level_1',
    };

    for(var i = 0; i < place.length; i++){

        var types = place[i].types; // get types array of each component 

        for(var j = 0; j < types.length; j++){ // loop through the types array of each component as types is an array and same thing can be indicated by different name.As you can see in the json object above 

              var component_type = types[j];

              // check if this type is in your component map.If so that means you want this component

              if(componentMap.hasOwnProperty(component_type)){


                console.log(place[i]['long_name']);

              }
        }
    }