How to limit Google Maps Places Autocomplete API results to cities?

Question

I am building a weather app using openweather API and Google Maps autocomplete API with React. In order to limit suggestions to cities, based on the information I have reached on Google API documentation and this site, I wrote the code on index.html as follows:

<script src="https://maps.googleapis.com/maps/api/js?types=(cities)&key=${myApi}&libraries=places"></script>

Also, added types: ["(cities)"]to the component that input window that uses autocomplete API. But neither of them worked and suggestions still include facility names and so on.

I appreciate your help in advance.

Answer 1

There's no need to put types=(cities) in your Maps JavaScript API script tag. Places APIs can work by including libraries=places alone.

You can use the types: ["(cities)"] in your autocomplete options or or call setTypes() to restrict predictions to certain place types.

const options = {
    types: ["(cities)"],
  };

Here's a sample code.