Google Maps API - Autocomplete Predictions for USA only

Question

I'm using Google Maps API example called 'Retrieving Autocomplete Predictions'. And I can't figure out how to filter it so it only returns places in the USA. I see how I could do it with the other examples...

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

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

But I can't seem to figure out how to apply it to my example. Here is my code...

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);
}

I tried this but it didn't work.

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);
}

Any Ideas? Thanks.

Answer 1

You are so very close but unfortunately to get this specific behavior you need to use getPlacePredictions() instead of getQueryPredictions(). This allows you to use AutocompletionRequest which has componentRestrictions however QueryAutocompletionRequest does not support componetRestictions and you must fall back to either using bounds to limit the scope of the search to a box or location to bias the search to prefer locations near a point.

Here is the solution with getPlacePredictions():

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

You can add location or bounds as keys to the options object if you must do this with getQueryPredictions()