Google Maps JavaScript API V3リバースジオコードを使用した郵便番号の取得
Googlemapsビューポートセンターが変更されるたびに、郵便番号を使用してクエリをDBに送信しようとしています。これは、次のようなリバースジオコーディングで実行できることを知っています。
google.maps.event.addListener(map, 'center_changed', function(){
newCenter();
});
...
function newCenter(){
var newc = map.getCenter();
geocoder.geocode({'latLng': newc}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
var newzip = results[0].address_components['postal_code'];
}
});
};
もちろん、このコードは実際には機能しません。したがって、結果の配列から郵便番号を抽出するために、これをどのように変更する必要があるのかと思っていました。ありがとう
よし、そうだ。解決策は私が望むよりも少し醜く、おそらく最後のforループは必要ありませんが、address_components []からがらくたを抽出する必要がある他の人のためのコードは次のとおりです。これはジオコーダーコールバック関数の内部にあります
// make sure to initialize i
for(i=0; i < results.length; i++){
for(var j=0;j < results[i].address_components.length; j++){
for(var k=0; k < results[i].address_components[j].types.length; k++){
if(results[i].address_components[j].types[k] == "postal_code"){
zipcode = results[i].address_components[j].short_name;
}
}
}
}
私がこれまでに気付いたことはほとんどの場合 ZIPCODEが 常に 返された各アドレス内の最後の値なので、最初の郵便番号（これは私の場合）を取得する場合は、次の方法を使用できます。
var address = results[0].address_components;
var zipcode = address[address.length - 1].long_name;
これは、underscore.js librarayを使用してかなり簡単に行うことができます。 http://documentcloud.github.com/underscore/#find
_.find(results[0].address_components, function (ac) { return ac.types[0] == 'postal_code' }).short_name
JQueryを使用していますか？
var searchAddressComponents = results[0].address_components,
searchPostalCode="";
$.each(searchAddressComponents, function(){
if(this.types[0]=="postal_code"){
searchPostalCode=this.short_name;
}
});
上記でshort_nameまたはlong_nameが機能します
「searchPostalCode」変数には、郵便番号（zip？）コードIFが含まれ、Google Maps APIから取得した場合にのみ含まれます。
クエリの代わりに「postal_code」を取得できない場合があります。
これにはforループが2つだけ必要です。最初の「タイプ」が「postal_code」であることを検出すると、「results」配列が更新されます。
次に、新しく見つかった配列セットで元の配列を更新し、再びループします。
var i, j,
result, types;
// Loop through the Geocoder result set. Note that the results
// array will change as this loop can self iterate.
for (i = 0; i < results.length; i++) {
result = results[i];
types = result.types;
for (j = 0; j < types.length; j++) {
if (types[j] === 'postal_code') {
// If we haven't found the "long_name" property,
// then we need to take this object and iterate through
// it again by setting it to our master loops array and
// setting the index to -1
if (result.long_name === undefined) {
results = result.address_components;
i = -1;
}
// We've found it!
else {
postcode = result.long_name;
}
break;
}
}
}
$.each(results[0].address_components,function(index,value){
if(value.types[0] === "postal_code"){
$('#postal_code').val(value.long_name);
}
});
このコードを使用して「郵便番号」と「地域」を取得しますが、タイプの値を変更するだけで他のフィールドを取得できます。
[〜＃〜] javascript [〜＃〜]
var address = results[0].address_components;
var zipcode = '';
var locality = '';
for (var i = 0; i < address.length; i++) {
if (address[i].types.includes("postal_code")){ zipcode = address[i].short_name; }
if (address[i].types.includes("locality")){ locality = address[i].short_name; }
}
このコードを使用することもできます。この関数は、ボタンのクリック、オンブラー、キーアップまたはキーダウンでZipを取得するのに役立ちます。
この関数にアドレスを渡すだけです。
現在は不要なので、有効なキーとセンサーオプションを削除してgoogle apiを使用します。
function callZipAPI(addSearchZip)
{
var geocoder = new google.maps.Geocoder();
var zipCode = null;
geocoder.geocode({ 'address': addSearchZip }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
//var latitude = results[0].geometry.location.lat();
//var longitude = results[0].geometry.location.lng();
var addressComponent = results[0].address_components;
for (var x = 0 ; x < addressComponent.length; x++) {
var chk = addressComponent[x];
if (chk.types[0] == 'postal_code') {
zipCode = chk.long_name;
}
}
if (zipCode) {
alert(zipCode);
}
else {
alert('No result found!!');
}
} else {
alert('Enter proper address!!');
}
});
}
places.getDetails( request_details, function(results_details, status){
// Check if the Service is OK
if (status == google.maps.places.PlacesServiceStatus.OK) {
places_postal = results_details.address_components
places_phone = results_details.formatted_phone_number
places_phone_int = results_details.international_phone_number
places_format_address = results_details.formatted_address
places_google_url = results_details.url
places_website = results_details.website
places_rating = results_details.rating
for (var i = 0; i < places_postal.length; i++ ) {
if (places_postal[i].types == "postal_code"){
console.log(places_postal[i].long_name)
}
}
}
});
これは私にとって非常にうまく機能しているようです。これは新しいGoogle Maps API V3での機能です。これが誰かに役立つ場合は、コメントを書いてください。私が話しているスクリプトを書いているので、状況が変わる可能性があります。
PHP私はこのコードを使用しています。ほぼすべての条件で機能します。
$Zip = $data["results"][3]["address_components"];
$Zip = $index[0]["short_name"];
インデックスに依存するよりも、コンポーネント内のアドレスタイプキーをチェックする方が良いと思います。スイッチケースを使用してこの問題を解決しました。
var address = '';
var pin = '';
var country = '';
var state = '';
var city = '';
var streetNumber = '';
var route ='';
var place = autocomplete.getPlace();
for (var i = 0; i < place.address_components.length; i++) {
var component = place.address_components[i];
var addressType = component.types[0];
switch (addressType) {
case 'street_number':
streetNumber = component.long_name;
break;
case 'route':
route = component.short_name;
break;
case 'locality':
city = component.long_name;
break;
case 'administrative_area_level_1':
state = component.long_name;
break;
case 'postal_code':
pin = component.long_name;
break;
case 'country':
country = component.long_name;
break;
}
}
ロメインM. —ありがとう！ Googleから最初に返された結果で郵便番号を見つける必要があるだけの場合は、2つのループを実行できます。
for(var j=0;j < results[0].address_components.length; j++){
for(var k=0; k < results[0].address_components[j].types.length; k++){
if(results[0].address_components[j].types[k] == "postal_code"){
zipcode = results[0].address_components[j].long_name;
}
}
}
私が得たように、ジップは最後またはそれ以前のものです。これが私の解決策である理由
const getZip = function (arr) {
return (arr[arr.length - 1].types[0] === 'postal_code') ? arr[arr.length - 1].long_name : arr[arr.length - 2].long_name;
};
const Zip = getZip(place.address_components);
return $http.get('//maps.googleapis.com/maps/api/geocode/json', {
params: {
address: val,
sensor: false
}
}).then(function (response) {
var model= response.data.results.map(function (item) {
// return item.address_components[0].short_name;
var short_name;
var st= $.each(item.address_components, function (value, key) {
if (key.types[0] == "postal_code") {
short_name= key.short_name;
}
});
return short_name;
});
return model;
});
一言で言えば、それは多くの努力です。少なくともv2 APIを使用すると、これらの詳細を取得できます。
var place = response.Placemark[0];
var point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);
myAddress = place.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.Thoroughfare.ThoroughfareName
myCity = place.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName
myState = place.AddressDetails.Country.AdministrativeArea.AdministrativeAreaName
myZipCode = place.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.PostalCode.PostalCodeNumber
先ほど行ったループの柔術を経由せずに個々のaddress_componentsを取得するよりエレガントな方法が必要です。
この単純なコードは私にとってはうまくいきます
for (var i = 0; i < address.length; i++) {
alert(address[i].types);
if (address[i].types == "postal_code")
$('#postalCode').val(address[i].long_name);
if (address[i].types == "")
$('#country').val(address[i].short_name);
}
今日では、Restful APIから取得する方が良いようです。
https://maps.googleapis.com/maps/api/geocode/json?latlng=40.714224,-73.961452&key=YOUR_KEY_HERE
AJAX GET呼び出しを使用すると完璧に機能します！
何かのようなもの：
var your_api_key = "***";
var f_center_lat = 40.714224;
var f_center_lon = -73.961452;
$.ajax({ url: "https://maps.googleapis.com/maps/api/geocode/json?latlng="+f_center_lat+","+f_center_lon+"&key="+your_api_key,
method: "GET"
})
.done(function( res ) { if (debug) console.log("Ajax result:"); console.log(res);
var zipCode = null;
var addressComponent = res.results[0].address_components;
for (var x = 0 ; x < addressComponent.length; x++) {
var chk = addressComponent[x];
if (chk.types[0] == 'postal_code') {
zipCode = chk.long_name;
}
}
if (zipCode) {
//alert(zipCode);
$(current_map_form + " #postalcode").val(zipCode);
}
else {
//alert('No result found!!');
if (debug) console.log("Zip/postal code not found for this map location.")
}
})
.fail(function( jqXHR, textStatus ) {
console.log( "Request failed (get postal code via geocoder rest api). Msg: " + textStatus );
});
JSONPath を使用すると、1行のコードで簡単に実行できます。
var Zip = $.results[0].address_components[?(@.types=="postal_code")].long_name;
//autocomplete is the text box where u will get the suggestions for an address.
autocomplete.addListener('place_changed', function () {
//Place will get the selected place geocode and returns with the address
//and marker information.
var place = autocomplete.getPlace();
//To select just the Zip code of complete address from marker, below loop //will help to find. Instead of y.long_name you can also use y.short_name.
var zipCode = null;
for (var x = 0 ; x < place.address_components.length; x++) {
var y = place.address_components[x];
if (y.types[0] == 'postal_code') {
zipCode = y.long_name;
}
}
});
Jqueryの使用
- 郵便番号がaddress_components配列のどの場所に保存されているかはわかりません。 address_components.length-1> pincodeが存在しない場合があります。これは、「Address to latlng」ジオコーディングに当てはまります。
- 郵便番号に「postal_code」文字列が含まれていることを確認できます。だから最善の方法はそれをチェックすることです。
var postalObject = $.grep(results[0].address_components, function(n, i) {
if (n.types[0] == "postal_code") {
return n;
} else {
return null;
}
});
$scope.query.Pincode = postalObject[0].long_name;