The Google Maps Places Autocomplete does not work as expected anymore.
https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete
When inserting a search string in the map (for example "ZKM"), it will give some recommendations in the drop down list. In this case it will be "ZKM | Zentrum für Kunst und Medientechnologie Karlsruhe, Lorenzstraße, Karlsruhe, Deutschland". When clicking this item, no marker will be placed on the map!
But when searching for "Karlsruhe" and clicking the first search result "Karlsruhe, Deutschland" the marker is placed correctly.
In the code a function called getPlace() ist called.
var place = autocomplete.getPlace();
The place should contain an object "geometry", but it does not.
Is there any workaround for this problem?
In order to use autocomplete, you must first load the Google Places library using the libraries parameter in the bootstrap URL for the Google Maps JavaScript API. The Places API offers two types of autocomplete widgets, which you can add via the Autocomplete and SearchBox classes respectively. Autocomplete adds a text input field on your web page.
The Places API offers two types of autocomplete widgets, which you can add via the Autocomplete and SearchBox classes respectively. Autocomplete adds a text input field on your web page. As the user enters text, autocomplete returns place predictions in the form of a dropdown pick list.
// Autocomplete. // 1. Unbind from map // 2. Reset the bounds to whole world // 3. Uncheck the strict bounds checkbox UI (which also disables strict bounds) Note: Read the guide on using TypeScript and Google Maps. // This example requires the Places library. Include the libraries=places // parameter when you first load the API. For example:
The radio buttons allow you to filter the types of predictions that the autocomplete returns. The Strict Bounds option restricts the search to the area within the current viewport. If this option is not checked, then the API biases the search to the current viewport, but it does not restrict it.
Please be sure you set 'geometry' field in autocomplete like this:
autocomplete.setFields(['address_component', 'geometry']);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With