Javascript从谷歌自动完成或从纬度和经度获取城市名称

标签 javascript jquery google-maps autocomplete geocoding

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

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”等。 如何从地址中获取正确的城市名称? 感谢帮助。

对于“Lenina,Minks,白俄罗斯”,我有这样的结果:

 {
  "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"
}

结果有两个地址组件...

最佳答案

以下是我提取城市名称的方法:(带有地理编码结果示例的工作示例)

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
}

关于Javascript从谷歌自动完成或从纬度和经度获取城市名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44239461/

相关文章:

javascript - 如何在 bootstrap 4 中提交表单

jquery - 使用 jQuery.css 在 Internet Explorer 中获取值

android - Android + Google API v2

javascript - 谷歌地图自定义 map 标记图像悬停不起作用

javascript - 如何使用 jquery json 获取多个下拉菜单

java - 如何计算两个 gio 点(lat 和 lng)之间的距离?

javascript - 根据 URL 单击选项卡

javascript - 如何在 Joomla 2.5 的页面中创建标签?

javascript - 使用带有 kineticJs 的 jquery 可拖动 UI 使元素对齐网格?

javascript - 使用 "$"替换会产生奇怪的结果