javascript 如何从 Google Places API 获取国家/地区代码
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33887081/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get the country code from Google Places API
提问by Amuk Saxena
I am trying to use HTML 5 GeoLocation to get longitude and latitude and then use Google Maps API to get the country codeof that longitude/latitude. Is there any simpler way to get country code from google places api?
我正在尝试使用 HTML 5 GeoLocation 获取经度和纬度,然后使用 Google Maps API获取该经度/纬度的国家/地区代码。有没有更简单的方法可以从 google place api 获取国家代码?
I found the solution from this link ==> Getting country code from Google Maps and HTML 5 GeoLocationto get the country code.
我从这个链接找到了解决方案 ==>从谷歌地图和 HTML 5 GeoLocation获取国家代码以获取国家代码。
Is there way to get country code directly from google places api without getting latitude and longitude first and then passing to google maps api.
有没有办法直接从谷歌地点 api 获取国家代码,而无需先获取纬度和经度,然后再传递给谷歌地图 api。
This is the following script that I am using to get the country code from google places api
这是我用来从谷歌地方 api 获取国家代码的以下脚本
<script>
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.
var placeSearch, autocomplete;
var componentForm = {
street_number: 'short_name',
route: 'long_name',
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
postal_code: 'short_name'
};
function initAutocomplete() {
// Create the autocomplete object, restricting the search to geographical
// location types.
autocomplete = new google.maps.places.Autocomplete(
/** @type {!HTMLInputElement} */(document.getElementById('autocomplete')),
{types: ['(cities)']});
// When the user selects an address from the dropdown, populate the address
// fields in the form.
//autocomplete.addListener('place_changed', fillInAddress);
// Get Latitude and longitude
google.maps.event.addListener(autocomplete, 'place_changed', function () {
var place = autocomplete.getPlace();
//document.getElementById('city2').value = place.name;
document.getElementById('lat').value = place.geometry.location.lat();
document.getElementById('lng').value = place.geometry.location.lng();
});
}
// [START region_fillform]
function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();
for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}
// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
}
}
// [END region_fillform]
</script>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places&callback=initAutocomplete"
async defer></script>
回答by geocodezip
To get the country code, get the short name of the address component with type country
:
要获取国家/地区代码,请使用 type 获取地址组件的短名称country
:
// for the country, get the country code (the "short name") also
if (addressType == "country") {
document.getElementById("country_code").value = place.address_components[i].short_name;
}
code snippet:
代码片段:
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.
function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();
for (var component in componentForm) {
document.getElementById(component).value = '';
}
// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
// for the country, get the country code (the "short name") also
if (addressType == "country") {
document.getElementById("country_code").value = place.address_components[i].short_name;
}
}
}
var placeSearch, autocomplete;
var componentForm = {
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
};
function initAutocomplete() {
// Create the autocomplete object, restricting the search to geographical
// location types.
autocomplete = new google.maps.places.Autocomplete(
/** @type {!HTMLInputElement} */
(document.getElementById('autocomplete')), {
types: ['(cities)']
});
// When the user selects an address from the dropdown, populate the address
// fields in the form.
// Get Latitude and longitude
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace();
document.getElementById('lat').value = place.geometry.location.lat();
document.getElementById('lng').value = place.geometry.location.lng();
fillInAddress();
});
}
google.maps.event.addDomListener(window, 'load', initAutocomplete);
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="locationField">
<input id="autocomplete" placeholder="Enter your address" type="text" />
</div>
<table id="address">
<tr>
<td class="label">City</td>
<td class="wideField" colspan="3">
<input class="field" id="locality" disabled="true" />
</td>
</tr>
<tr>
<td class="label">State</td>
<td class="slimField">
<input class="field" id="administrative_area_level_1" disabled="true" />
</td>
</tr>
<tr>
<td class="label">Country</td>
<td class="wideField" colspan="2">
<input class="field" id="country" disabled="true" />
</td>
<td class="label">Country Code</td>
<td class="shortField">
<input class="field" id="country_code" disabled="true" />
</td>
</tr>
<tr>
<td class="label">latitude</td>
<td class="wideField" colspan="3">
<input class="field" id="lat" disabled="true" />
</td>
</tr>
<tr>
<td class="label">longitude</td>
<td class="wideField" colspan="3">
<input class="field" id="lng" disabled="true" />
</td>
</tr>
</table>
回答by Ravindra Methaniya
You will get postal code, country, state, cityand other with using below function.
使用以下功能,您将获得邮政编码、国家/地区、州、城市和其他信息。
export let placeAddresCompoponent = {
ZIP_CODE: 'postal_code',
COUNTRY: 'country',
STATE: 'administrative_area_level_1',
CITY: 'administrative_area_level_2',
TOWN: 'sublocality_level_1',
AREA: 'sublocality_level_2',
NEAREST_ROAD: 'route'
}
Use the below function for getting data from the address component. You will get address_componentsfrom the result of Google Place Api.
使用以下函数从地址组件获取数据。您将从Google Place Api的结果中获得address_components。
export function getAddressComponent(address_components, key) {
var value='';
var postalCodeType = address_components.filter(aComp =>
aComp.types.some(typesItem => typesItem === key))
if (postalCodeType != null && postalCodeType.length > 0)
value = postalCodeType[0].long_name
return value;
}
You can get the specific address component using below.
您可以使用下面的方法获取特定的地址组件。
addressComponent= Array of address_componentsfrom google place api result
addressComponent=来自 google place api 结果的address_components数组
var zipCode = getAddressComponent(addressComponent, placeAddresCompoponent.ZIP_CODE)
var country = getAddressComponent(addressComponent, placeAddresCompoponent.COUNTRY)
console.log('zipCode : ', zipCode)
console.log('country : ', country)
回答by Amuk Saxena
Finally got the solution to get country code in google search api. This code may help to someone.
终于得到了在 google search api 中获取国家代码的解决方案。此代码可能对某人有所帮助。
<script>
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.
var placeSearch, autocomplete;
var componentForm = {
street_number: 'short_name',
route: 'long_name',
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
postal_code: 'short_name',
political: 'short_name'
};
function initAutocomplete() {
// Create the autocomplete object, restricting the search to geographical
// location types.
autocomplete = new google.maps.places.Autocomplete(
/** @type {!HTMLInputElement} */(document.getElementById('autocomplete')),
{types: ['(cities)']});
// When the user selects an address from the dropdown, populate the address
// fields in the form.
autocomplete.addListener('place_changed', fillInAddress);
}
// [START region_fillform]
function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();
for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}
// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
if(place.address_components[i][componentForm['political']]){
console.log(place.address_components[i][componentForm['country']]);
if(isNaN(place.address_components[i][componentForm['political']])){
country_code=place.address_components[i][componentForm['political']];
var country_name=place.address_components[i][componentForm['country']];
}
}
document.getElementById(addressType).value = val;
}
}
// **Country code, Country name goes here**
document.getElementById("Country_code").value=country_code;
document.getElementById("Country_name").value=country_name;
console.log('Country Code='+country_code+', Country Name='+country_name);
}
// [END region_fillform]
</script>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places&callback=initAutocomplete"
async defer></script>
回答by balram bochliya
<?php
$address = '77-379 North End road, London London SW61NP, United Kingdom'; // Your address(Please USe exist address)
$prepAddr = str_replace(' ','+',$address);
$geocode=file_get_contents('https://maps.google.com/maps/api/geocode/json?address='.$prepAddr.'&key=AIzaSyDUpz-WEZ7r24PPkGKEuyqBd9VsPPVPcQk&sensor=false');
$output= json_decode($geocode);
if ( isset($output->results) ) {
if ( isset($output->results[0]) ) {
if ( isset($output->results[0]->address_components) ) {
foreach ($output->results[0]->address_components as $key => $value) {
if ( isset($value->types) ) {
if ( isset($value->types[0]) ) {
if($value->types[0] == 'country'){
print_r($value->short_name); //GB
}
}
}
}
}
}
} ?>