How can I prioritize country in Google map autocomplete?

Question

I would like my autocomplete to show a specified country first, than the other countries.

Right now I have this:

const autocompleteService = new window.google.maps.places.AutocompleteService()
const location = window.google.maps.LatLng(48.856614, 2.3522219)
const query = {
  location: location,
  radius: 1000,
  types: ["(cities)"]
}
autocompleteService.getPlacePredictions(query, cb)

But when I'm typing lond, I get London first instead of french cities (such as Londinières)

EDIT:

I also tried with the bounds option, and I'm getting the same results

const bounds = new window.google.maps.LatLngBounds(
  new window.google.maps.LatLng(49.79295, 1.20374),
  new window.google.maps.LatLng(49.921316, 1.498147)
)
const autocompleteService = new window.google.maps.places.AutocompleteService()
const location = window.google.maps.LatLng(48.856614, 2.3522219)
const query = {
  bounds: bounds,
  types: ["(cities)"]
}

Variant 1: specify the country in your query. This will however only return results for that country. Variant 2: Sort the returned array by country. Use the place_id and run a Place Details request: https://developers.google.com/maps/documentation/javascript/places#place_details to determine the sort order. Might be slow. — clocktown, Aug 21 '19 at 14:46

score 2 · Answer 1 · answered Aug 21 '19 at 14:47

The AutocompletionRequest has a property called componentRestrictions which can be used to provide a list of countries to restrict the search to:

const autocompleteService = new window.google.maps.places.AutocompleteService()
const location = window.google.maps.LatLng(48.856614, 2.3522219)
const query = {
  location: location,
  radius: 1000,
  types: ["(cities)"],
  componentRestrictions: { country: 'fr' }
}
autocompleteService.getPlacePredictions(query, cb)

This may be too restrictive for your purposes, but you may be able to combine the results of this query with your original query to also get suggestions outside of your preferred country.

score 0 · Answer 2 · answered Aug 21 '19 at 14:42

You can try this code (provided you can find your coordinates first.

var southWest = new google.maps.LatLng(42.97250, -3.82324);
var northEast = new google.maps.LatLng(51.64529, 5.49316);
var bounds = new google.maps.LatLngBounds(southWest,northEast);
var autocomplete = new google.maps.places.Autocomplete(input, {bounds: bounds});
google.maps.event.addListener(autocomplete, 'place_changed', function () {
  //...
});

How can I prioritize country in Google map autocomplete?

2 Answers2