I have the followıng query, which is a ZIP code:
11368
.
When I create a autocomplete object (not the service) I am getting the zip code's actual region at the top:
This is the code:
autocomplete = new google.maps.places.Autocomplete(
document.getElementById('PlaceSearch'),
{ types: ['(regions)'] });
[...]
This is exactly what I want. However, I need to use a custom autocomplete system site-wise for design reasons so I've moved to AutocompleteService
which is the non-UI, code-only version of the same thing (well at least it should be). I create my autocomplete service:
x = new google.maps.places.AutocompleteService();
And I use:
x.getQueryPredictions({ input: key }, function (results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
[...]
});
});
However, this is what I get from the results:
I am using description
property to display the entry, though it's not the problem as place IDs of the first entry in returned locations are completely different as well even though I'm typing in exactly the same query.
I've also tried:
x.getQueryPredictions({ input: key, types: ['(regions)'] }
,
x.getQueryPredictions({ input: key, types: ['(geocode)'] }
,
x.getQueryPredictions({ input: key, types: ['geocode'] }
However it doesn't have any effect at all. It's exactly the same. I've also seen Different result between google maps Autocomplete and AutocompleteService but it's answer answers a question at the typeahead
level while the results at my query are incorrect at the API level without even hitting typeahead; I've checked it with a debugger at the callback function directly from the autocomplete service.
I've then inspected network requests at both cases and here is the request at the working on:
https://maps.googleapis.com/maps/api/place/js/AutocompletionService.GetPredictions?1s11368&4sen-US&9s(regions)&15e3&key=XXXXXX&callback=_xdc_._qxy1y2&token=45006
It returns the correct JSON.
Here is the request that returns the incorrect JSON:
https://maps.googleapis.com/maps/api/place/js/AutocompletionService.GetQueryPredictionsJson?1s11368&4sen-US&9s(regions)&15e3&key=XXXXXX&callback=_xdc_._38p24d&token=20471
And it returns the incorrect JSON. From what I see it's clear that I need to pass in (regions)
as the types
parameter, and it's still incorrect. More absurd, the only difference between the two queries is a variable called token
(I've tried replacing the incorrect query's token with the correct one's but I've got The Google Maps JavaScript API must be downloaded directly from Google's servers.
error) and the callback function, which I'm sure has nothing to do with the returned JSON. The only thing I can think of that is Google does something at initialization level on its servers while returning the token, which bound to that server/instance (hence the token).
What am I doing wrong and how can I get the same results with Google's own typeahead implementation programatically?
The Place Autocomplete service can match on full words and substrings, resolving place names, addresses, and plus codes. Applications can therefore send queries as the user types, to provide on-the-fly place predictions.
If you're building a client-side application, take a look at the Places SDK for Android, the Places SDK for iOS, and the Places Library, Maps JavaScript API . The Place Autocomplete service is a web service that returns place predictions in response to an HTTP request. The request specifies a textual search string and optional geographic bounds.
Note: You can use Place Autocomplete even without a map. If you do show a map, it must be a Google map. When you display predictions from the Place Autocomplete service without a map, you must include the ' Powered by Google ' logo displayed inline with the search field/results.
A random string which identifies an autocomplete session for billing purposes. The session begins when the user starts typing a query, and concludes when they select a place and a call to Place Details is made. Each session can have multiple queries, followed by one place selection.
I've found the solution. I was calling getQueryPredictions
instead of getPredictions
and it was returning different results. I've changed my code to call getPredictions
and it started working correctly.
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