11

ジオコーディングで Google Places API を使用しています。アドレス コンポーネント タイプに問題があります。

ユーザーがこの形式でオートコンプリートに入力した住所に関する情報を取得したい:
番地/番地/市/州/国。

ユーザーが「Street 12, SomeCity, SomeProvince, SomeCountry」をオートコンプリートした場合、このすべての情報をアラートで返したいと思います。しかし、ユーザーが「someProvince、SomeCountry」のみを入力すると、州と国の住所タイプのみが必要になります。

これが私のコードです：

google.maps.event.addListener(autocomplete, 'place_changed', function () {
    var place = autocomplete.getPlace();
    alert('0: ' + place.address_components[0].long_name);
    alert('1: ' + place.address_components[1].long_name);
    alert('2: ' + place.address_components[2].long_name);
    alert('3: ' + place.address_components[3].long_name);
    alert('4: ' + place.address_components[4].long_name);
    alert('5: ' + place.address_components[5].long_name);
    alert('6: ' + place.address_components[6].long_name);
    alert('7: ' + place.address_components[7].long_name);
)};

問題は、ユーザーが完全な住所をオートコンプリートすると、このアラートがすべて正しく表示されることです。しかし、情報の一部のみ (国のみ) をオートコンプリートすると、入力された国が 7 回表示されます。

http://gmaps-samples-v3.googlecode.com/svn/trunk/places/autocomplete-addressform.html

通りと都市が指定されていない場合、アラートが表示されるようにしたい（「通りはnull」など）。どうやってするの？

4

7 に答える 7

12

この機能をプロジェクト用に作成しました。解析します

  • 街
  • 番号
  • 国
  • ジップ
  • 街

Google ジオレスポンスから

function parseGoogleResponse(components) {
    _.each(components, function(component) {
      _.each(component.types, function(type) {
        if (type === 'route') {
          $("input[name=street]").val(component.long_name)
        }
        if (type === 'street_number') {
          $("input[name=nr]").val(component.long_name)
        }
        if (type === 'locality') {
          $("input[name=city]").val(component.long_name)
        }
        if (type === 'country') {
          $("input[name=country]").val(component.long_name)
        }
        if (type === 'postal_code') {
          $("input[name=zip]").val(component.long_name)
        }
      })
    })
  }
于 2014-08-05T14:53:08.993 に答える
11

住所タイプと住所コンポーネント タイプ

タイプを使用して、住所フィールドにマップします。都市、郡、州などは、文脈によって意味が異なる場合があることに注意してください。たとえば、ロサンゼルス ('locality') にあるためNorth Hollywood、タイプが思いつきます。neighborhood

function placeToAddress(place){
        var address = {};
        place.address_components.forEach(function(c) {
            switch(c.types[0]){
                case 'street_number':
                    address.StreetNumber = c;
                    break;
                case 'route':
                    address.StreetName = c;
                    break;
                case 'neighborhood': case 'locality':    // North Hollywood or Los Angeles?
                    address.City = c;
                    break;
                case 'administrative_area_level_1':     //  Note some countries don't have states
                    address.State = c;
                    break;
                case 'postal_code':
                    address.Zip = c;
                    break;
                case 'country':
                    address.Country = c;
                    break;
                /*
                *   . . . 
                */
            }
        });

        return address;
    }
于 2016-05-19T22:07:36.333 に答える
6

demoに従って、返された住所コンポーネントのそれぞれをチェックして、通り/都市が返されたかどうかを確認する必要があります。

google.maps.event.addListener(autocomplete, 'place_changed', function() {
    var place = autocomplete.getPlace();
    var components = place.address_components;
    var street = null;
    for (var i = 0, component; component = components[i]; i++) {
        console.log(component);
        if (component.types[0] == 'route') {
            street = component['long_name'];
        }
    }
    alert('Street: ' + street);
});
于 2012-12-07T05:18:17.123 に答える
3

AngularJS 用にこの関数を作成しました。

function getAddressComponentByPlace(place) {
    var components;

    components = {};

    angular.forEach(place.address_components, function(address_component) {
        angular.forEach(address_component.types, function(type) {
            components[type] = address_component.long_name;
        });
    });

    return components;
}

結果は次のようになります。

administrative_area_level_1: "Berlin"
country: "Deutschland"
locality: "Berlin"
political: "Deutschland"
postal_code: "10719"
route: "Kurfürstendamm"
street_number: "1"
sublocality: "Bezirk Charlottenburg-Wilmersdorf"
sublocality_level_1: "Bezirk Charlottenburg-Wilmersdorf"

ES6 バージョン

  const parseGoogleAddressComponents = (addressComponents) => {
    let components = {};
    addressComponents.forEach((addressComponent) => {
      addressComponent.types.forEach((type) => {
        components[type] = addressComponent.long_name;
      });
    });
  
    return components;
  };
于 2017-03-20T12:03:48.363 に答える