Google Maps API-прогнозы автозаполнения только для США

Я использую пример API Google Maps под названием'Получение Прогнозов Автозаполнения'. И я не могу понять, как его фильтровать, чтобы он возвращал только места в США. Я вижу, как я мог бы сделать это с другими примерами... 

var input = document.getElementById('searchTextField');
var options = {
      types: ['(cities)'],
      componentRestrictions: {country: 'us'}
    };

autocomplete = new google.maps.places.Autocomplete(input, options);

но я не могу понять, как применить его к моему примеру. Вот мой код...

function GetAddressPredictions(Search) {
    var displaySuggestions = function (predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK) {
        return;
    }
    predictions.forEach(function (prediction) {
        PredictionArray.push(prediction);
    });
};
var service = new google.maps.places.AutocompleteService();
service.getQueryPredictions({input: Search}, displaySuggestions);
}

Я пробовал это, но это не сработало.

function GetAddressPredictions(Search) {
    var displaySuggestions = function (predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK) {
        return;
    }
    predictions.forEach(function (prediction) {
        PredictionArray.push(prediction);
    });
};
var options = {
    types: ['(cities)'],
    componentRestrictions: {country: 'us'}
      };
    var service = new google.maps.places.AutocompleteService();
    service.getQueryPredictions({input: Search, options}, displaySuggestions);
}

Какие Идеи? Спасибо.

8
google-maps google-maps-api-3 javascript maps

5 ответов

вы так близко, но, к сожалению, чтобы получить это конкретное поведение, вам нужно использовать getPlacePredictions() вместо getQueryPredictions(). Это позволяет использовать AutocompletionRequest имеющего QueryAutocompletionRequest не поддерживает componetRestictions и вы должны вернуться либо с помощью bounds чтобы ограничить область поиска до поля или location для смещения поиска, чтобы предпочесть места рядом с точкой.

вот решение с getPlacePredictions():

  var service = new google.maps.places.AutocompleteService();
  var options = {
    input: Search,
    types: ['(cities)'],
    componentRestrictions: {country: 'us'}
  };
  service.getPlacePredictions(options , displaySuggestions);

вы можете добавить location или bounds как ключи к объекту options, если вы должны сделать это с getQueryPredictions()

4

функции getQueryPredictions принимает QueryAutocompletionRequest object как его параметр, и QueryAutocompletionRequest не имеет свойства, чтобы ограничить его определенной страной.

тем не менее, вы можете просто добавить "Соединенные Штаты" или " США " к запросу перед отправкой:

service.getQueryPredictions({
   input: 'pizza near Syd' + ' usa'
}, displaySuggestions);

Если вы не хотите, чтобы", США" отображались в возвращаемых результатах, вы можете удалить его с помощью JavaScript replace функция:

predictions.forEach(function(prediction) {
   var li = document.createElement('li');
   li.appendChild(document.createTextNode(prediction.description.replace(', USA', '')));
   document.getElementById('results').appendChild(li);
});

демо:https://jsfiddle.net/sdz4yssL/2/

также обратите внимание, что если есть риск того, что условия поиска уже включают США или их изменение, то вам нужно будет сначала удалить любые вхождения из условий поиска (обычно используя регулярное выражение для игнорирования чувствительности к регистру), иначе поиск чего - то вроде "pizza usa usa" не вернет никаких результатов:

input: (' ' + 'pizza near us Syd usa United States US' + ' ').replace(/ usa /ig,' ').replace(/ US /ig,' ').replace(/ united states /ig,' ') + ' usa'

(я добавил пробел до и после запроса, чтобы функции замены по-прежнему будут совпадать в начале и в самом конце)

2

вы пробовали что-то вроде этого:

function GetAddressPredictions(Search) {

    var displaySuggestions = function(predictions, status) {
        if (status != google.maps.places.PlacesServiceStatus.OK) {
            return;
        }

        predictions.forEach(function(prediction) {
            PredictionArray.push(prediction);
        });
    };

    var service = new google.maps.places.AutocompleteService();
    service.getQueryPredictions({ 
            input: Search, 
            types: ['(cities)'], 
            componentRestrictions: {country: 'us'} 
        }, displaySuggestions);
}
1

вопреки вышеизложенным, AutocompleteService принимает значение QueryAutocompletionRequest или AutocompletionRequest поэтому я думаю, что то, как вы передаете свои варианты, неправильно. Это не просто:

var options = {
    input: Search, 
    types: ['(cities)'],
    componentRestrictions: {country: 'us'}
};

var service = new google.maps.places.AutocompleteService();
service.getQueryPredictions(options, displaySuggestions);

пожалуйста, имейте в виду, что это все для прогнозирование смещения вы не можете попросить PAC исключить результаты, только смещение.

1

С немного поиска можно было найти решение.

запрос был одобрен и выпущен ранее в этом году: Запрос Google

документацию по такой информации можно прочитать здесь:Документация Google

реализация:

HTML-код :

<div id="text">
  Search Place:
</div>

<div id="locationField">
  <input id="autocomplete" placeholder="Enter text" type="text" />
</div>


<div id="map"></div>

ограничить, в какой стране используется глобальная переменная, Великобритания для Великобритании, США для Америки так далее...

var countryRestrict = {
  'country': 'uk'
};
var autocomplete;

Auto complete затем создается с использованием следующего:

 autocomplete = new google.maps.places.Autocomplete(
     (
      document.getElementById('autocomplete')), {
      componentRestrictions: countryRestrict
    });
  places = new google.maps.places.PlacesService(map);

  autocomplete.addListener('place_changed', onPlaceChanged);

при изменении текста мы вызываем функцию onPlacesChanged:

function onPlaceChanged() {
  var place = autocomplete.getPlace();
  if (place.geometry) {
    map.panTo(place.geometry.location);
    map.setZoom(5);
    var marker = new google.maps.Marker({
      position: place.geometry.location,
      map: map,
    });
  } else {
    document.getElementById('autocomplete').placeholder = 'Enter a Value';
  }
}

это вызывает функцию get place и добавляет маркер к значению, которое вы нажали.

JSFIDDLE:https://jsfiddle.net/hn8091fk/

1