2

このコードは機能していません。正確な解決策を教えてください

<script src="maps.googleapis.com/maps/api/…; type="text/javascript"></script>
<script type="text/javascript">
   function initialize() {
      var input = document.getElementById('searchTextField');
      /* restrict to multiple cities? */
      var options = {
          types: ['(cities)'],
          componentRestrictions: {country: ["usa", "uk"]}
      };
      var autocomplete = new google.maps.places.Autocomplete(input, options); 
   }
   google.maps.event.addDomListener(window, 'load', initialize);
</script>

アップデート

2017 年 1 月に、Maps JavaScript API のバージョン 3.27 で、オートコンプリートの複数の国フィルターが導入されました。

オートコンプリートの予測を、複数の国からのみ表示されるように制限できるようになりました。これを行うには、AutocompleteOptions の componentRestrictions フィールドに最大 5 つの国を指定します。

https://developers.google.com/maps/documentation/javascript/releases#327

4

6 に答える 6

6

まず、複数の国からフィルタリングすることはできません。これは、こちらで報告されている既知の問題です。

次に、コードについては、国コードに 2 文字の文字列を使用する必要があります。

componentRestrictions を使用して、結果を特定のグループに制限できます。現在、componentRestrictions を使用して国別にフィルタリングできます。国は、ISO 3166-1 Alpha-2 互換の国コードとして 2 文字で渡す必要があります。ソース。

これは、私が jsfiddledした 1 つの国で動作するサンプルです ( Google のサンプル リストから取得)。

于 2012-07-02T09:57:51.357 に答える
4

複数のオートコンプリートdivの位置を操作することで私が使用してきた回避策は次のとおりです。

    var location = $('#location');
var options1 =  { 
                    types: ['(cities)'],
                    componentRestrictions: {country: 'uk'}
                }
var options2 =  { 
                    types: ['(cities)'],
                    componentRestrictions: {country: 'irl'}
                }
if (location.exists()) { 
    $(location).each(function(index){
        new google.maps.places.Autocomplete(this, options2);
        new google.maps.places.Autocomplete(this, options1);
    });
 var pressed = 0;
            google.maps.event.addDomListener(this, 'keydown', function(e){
            if (e.keyCode == 40 || e.keyCode == 38) { 
                e.preventDefault();
                e.stopPropagation();
                e.stopImmediatePropagation();
            }
        },true); 
    location.keypress(function(e) {
        setTimeout(function(e){
            setInterval(function(e){
            if($('.pac-container.pac-logo').last().css('display') != 'none' ){
                $('.pac-container.pac-logo').first().children('.pac-item').appendTo($('.pac-container.pac-logo').last())
            }
            else{
                $('.pac-container.pac-logo').last().children('.pac-item').appendTo($('.pac-container.pac-logo').first())
            }
            },100)

        }
        ,300)
    });
}

CSS:

.pac-container.pac-logo:last-of-type {
     box-shadow: none !important;
}
.pac-container.pac-logo:last-of-type:after {
    content: none !important;
}
于 2016-05-23T08:43:07.060 に答える
3

Google からの解決策を 2 年間待った後、新しいプロジェクトの回避策に気付きました。

この関数は、複数のコンポーネント制限をフィルタリングし、上位の結果を 1 つの配列にマージしています。これは、特定の結果セットが次々に与えられることを意味します。

おそらく、このソリューションは最適化できます。つまり、すべての国または地域の結果全体を、行政区域、都市、および通りの「重み」に頼る必要があります。

いじられたスクリプトはこちらです。

主な機能 (コールバックを伴う複数のリクエスト):

       service = new google.maps.places.AutocompleteService();
       var request1 = {
         input: inputData,
         componentRestrictions: {country: 'de'},
       };
       var request2 = {
         input: inputData,
         componentRestrictions: {country: 'at'},
       };
       var request3 = {
         input: inputData,
         componentRestrictions: {country: 'ch'},
       };
       $('#result').empty();
       service.getPlacePredictions(request1, callback);
       service.getPlacePredictions(request2, callback);            
       service.getPlacePredictions(request3, callback);
于 2016-03-17T14:51:21.113 に答える
-2

複数の国のアドレスを取得するためにラジオボタン/チェックボックスなどを配置しない理由は、おそらくこれでうまくいくでしょう。var valueofcountry= "ca"; // この値がチェックボックス/ラジオから来ているとします

    var autoCompleteOptions = {componentRestrictions: {country: valueofcountry}};
于 2015-07-30T14:54:36.747 に答える