Javascript 从谷歌自动完成或从 lat 和 lng 获取城市名称答案

【问题标题】：Javascript get city name from google autocomplete or from lat and lngJavascript 从谷歌自动完成或从 lat 和 lng 获取城市名称
【发布时间】：2017-05-29 09:51:20
【问题描述】：

我找到了一种从谷歌自动完成或从 lat 和 lng 获取正确城市名称的方法。现在我使用这段代码：

google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
for (var i = 0; i < place.address_components.length; i++) {
  for (var j = 0; j < place.address_components[i].types.length; j++) {                 
        if (place.address_components[i].types[j] == "locality") {$("#city").val(place.address_components[i].long_name);
         }

现在我使用类型“locality”作为城市名称，但有时对于其他地址，它可能是“administrative_area_level_1”、“administrative_area_level_2”、“administrative_area_level_3”等。如何从地址中获取正确的城市名称？感谢帮助。

对于“列宁娜，明克斯，白俄罗斯”，我有这样的结果：

 {
  "results" : [
  {
     "address_components" : [
        {
           "long_name" : "vulica Lienina",
           "short_name" : "vulica Lienina",
           "types" : [ "route" ]
        },
        {
           "long_name" : "Minsk",
           "short_name" : "Minsk",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "Belarus",
           "short_name" : "BY",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "vulica Lienina, Minsk, Belarus",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : 53.9049197,
              "lng" : 27.5804421
           },
           "southwest" : {
              "lat" : 53.8868641,
              "lng" : 27.553896
           }
        },
        "location" : {
           "lat" : 53.8958051,
           "lng" : 27.5659861
        },
        "location_type" : "GEOMETRIC_CENTER",
        "viewport" : {
           "northeast" : {
              "lat" : 53.9049197,
              "lng" : 27.5804421
           },
           "southwest" : {
              "lat" : 53.8868641,
              "lng" : 27.553896
           }
        }
     },
     "place_id" : "ChIJL_x0NsTP20YRE6LICTM5v2I",
     "types" : [ "route" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "Lenina",
           "short_name" : "Lenina",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "Slucki rajon",
           "short_name" : "Slucki rajon",
           "types" : [ "administrative_area_level_2", "political" ]
        },
        {
           "long_name" : "Minskaja voblasć",
           "short_name" : "Minskaja voblasć",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Belarus",
           "short_name" : "BY",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "Lenina, Belarus",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : 53.0604058,
              "lng" : 27.2418881
           },
           "southwest" : {
              "lat" : 53.0405422,
              "lng" : 27.2215462
           }
        },
        "location" : {
           "lat" : 53.0546355,
           "lng" : 27.229549
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : 53.0604058,
              "lng" : 27.2418881
           },
           "southwest" : {
              "lat" : 53.0405422,
              "lng" : 27.2215462
           }
        }
     },
     "place_id" : "ChIJNTp2Gl6t2UYRI1cE6L4oVh8",
     "types" : [ "locality", "political" ]
  }
 ],
"status" : "OK"
}

结果有两个address_components...

【问题讨论】：

标签： javascript jquery google-maps autocomplete geocoding

【解决方案1】：

这是我提取城市名称的方法：（带有地理编码结果示例的工作示例）

let results = [
  {
     "address_components" : [
        {
           "long_name" : "vulica Lienina",
           "short_name" : "vulica Lienina",
           "types" : [ "route" ]
        },
        {
           "long_name" : "Minsk",
           "short_name" : "Minsk",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "Belarus",
           "short_name" : "BY",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "vulica Lienina, Minsk, Belarus",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : 53.9049197,
              "lng" : 27.5804421
           },
           "southwest" : {
              "lat" : 53.8868641,
              "lng" : 27.553896
           }
        },
        "location" : {
           "lat" : 53.8958051,
           "lng" : 27.5659861
        },
        "location_type" : "GEOMETRIC_CENTER",
        "viewport" : {
           "northeast" : {
              "lat" : 53.9049197,
              "lng" : 27.5804421
           },
           "southwest" : {
              "lat" : 53.8868641,
              "lng" : 27.553896
           }
        }
     },
     "place_id" : "ChIJL_x0NsTP20YRE6LICTM5v2I",
     "types" : [ "route" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "Lenina",
           "short_name" : "Lenina",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "Slucki rajon",
           "short_name" : "Slucki rajon",
           "types" : [ "administrative_area_level_2", "political" ]
        },
        {
           "long_name" : "Minskaja voblasć",
           "short_name" : "Minskaja voblasć",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Belarus",
           "short_name" : "BY",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "Lenina, Belarus",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : 53.0604058,
              "lng" : 27.2418881
           },
           "southwest" : {
              "lat" : 53.0405422,
              "lng" : 27.2215462
           }
        },
        "location" : {
           "lat" : 53.0546355,
           "lng" : 27.229549
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : 53.0604058,
              "lng" : 27.2418881
           },
           "southwest" : {
              "lat" : 53.0405422,
              "lng" : 27.2215462
           }
        }
     },
     "place_id" : "ChIJNTp2Gl6t2UYRI1cE6L4oVh8",
     "types" : [ "locality", "political" ]
  }
 ]
   
let matches = results[0].address_components.filter(address_component =>
			["locality", "colloquial_area"].some(word => ~address_component.types.indexOf(word)))

if (!matches || !matches.length) {
  console.log("Could not resolve city name.")
} else {
  console.log("Found city : ", matches[0].short_name) // Prints : Minsk
}

【讨论】：

所以你也使用地方类型作为城市？是的，有时它有效，但例如，对于地址“Lenina，Minsk，Belarus”，它显示的城市名称类似于“Lenina”，但必须显示 Minsk。
您能否在原始问题中添加一个您无法利用的结果样本（就像我所做的那样，一个完整的结果 JSON）？
我在帖子中添加了 json 结果。并且发现结果中有两个address_components。我怎样才能只使用第一个 address_components ？
我刚刚用你的结果替换了我的结果，它正确输出“Minsk”。
它是指向 json 的链接：maps.googleapis.com/maps/api/geocode/… ` var place = autocomplete.getPlace();让匹配 = place.address_components.filter(address_component => ["locality", "colloquial_area"].some(word => ~address_component.types.indexOf(word))); if (!matches || !matches.length) { return console.log("Could not resolve city name") } let foundCity = matches[0].short_name;` =locality from second address_components