My requirement is to get google places autoplete suggestion only for the places in Bangalore, but if I search for any other place apart from bangalore then also I get the suggestions which I don't want. I have found many stackoverflow links related to my question but none of them are solving my problem.

Is this possible to get the suggestions of any particular city ?

I am sharing my code below :-

var input = (document.getElementById('address'));
          var s_w = new google.maps.LatLng( 12.97232, 77.59480 ); //southwest
          var n_e = new google.maps.LatLng( 12.89201, 77.58905 ); //northeast
          var b_bounds = new google.maps.LatLngBounds( s_w, n_e ); //bangalorebounds

var options = {
            bounds:b_bounds,
            ponentRestrictions: {country: "in"}
           };
var autoplete = new google.maps.places.Autoplete(input, options);

autoplete.bindTo('bounds', map);

autoplete.addListener('place_changed', function() {

  //rest_of_the_code

});

Please somebody help !!

My requirement is to get google places autoplete suggestion only for the places in Bangalore, but if I search for any other place apart from bangalore then also I get the suggestions which I don't want. I have found many stackoverflow links related to my question but none of them are solving my problem.

Is this possible to get the suggestions of any particular city ?

I am sharing my code below :-

var input = (document.getElementById('address'));
          var s_w = new google.maps.LatLng( 12.97232, 77.59480 ); //southwest
          var n_e = new google.maps.LatLng( 12.89201, 77.58905 ); //northeast
          var b_bounds = new google.maps.LatLngBounds( s_w, n_e ); //bangalorebounds

var options = {
            bounds:b_bounds,
            ponentRestrictions: {country: "in"}
           };
var autoplete = new google.maps.places.Autoplete(input, options);

autoplete.bindTo('bounds', map);

autoplete.addListener('place_changed', function() {

  //rest_of_the_code

});

Please somebody help !!

• javascript
• google-maps
• google-maps-api-3
• autoplete

4 Answers 4

Try like this.

var bangaloreBounds = new google.maps.LatLngBounds(
   new google.maps.LatLng(12.864162, 77.438610),
   new google.maps.LatLng(13.139807, 77.711895));

var autoplete = new google.maps.places.Autoplete(this, {
   bounds: bangaloreBounds,
   strictBounds: true,
});

autoplete.addListener('place_changed', function () {

});

Note: The URL should be: https://maps.googleapis./maps/api/js?libraries=places&key=YOUR_API_KEY

strictBounds option was added in version 3.27 of Maps JavaScript API which is currently (January 2017) the experimental version.

I think that you can try this:

var cityBounds = new google.maps.LatLngBounds(
  new google.maps.LatLng(25.341233, 68.289986),
  new google.maps.LatLng(25.450715, 68.428345));

var options = {
  bounds: cityBounds,
  types: ['geocode'],
  ponentRestrictions: {country: 'est'}
};

Replace LatLng value with your values and country with your country code.

You can use bounds to bias results, but there is no strict filter by city in places autoplete at the moment.

You can find a feature request to add more strict filters in the public issue tracker:

https://code.google./p/gmaps-api-issues/issues/detail?id=4433

Please star this feature request to express your interest and receive updates from Google.

Google is not providing autoplete for particular city but we can do it manually. in my case i want to display address of 'Maharashtra' state.

  this.GoogleAutoplete = new google.maps.places.AutopleteService();

    this.GoogleAutoplete.getPlacePredictions(
  {
    input: this.autopleteFrom.input,
    types: ['geocode'],
    ponentRestrictions: { country: 'in' },
  },
  (predictions, status) => {
    this.autopleteItemsFrom = [];
    this.zone.run(() => {
      if (predictions) {
        console.log(predictions)
        predictions.forEach((prediction) => {
          var statearray = prediction.description.split(",")
          var state = statearray[statearray.length - 2]
          if(state === ' Maharashtra'){
            this.autopleteItemsFrom.push(prediction);
          }
        });
      }
    });
  });

i hope it will help you.