Hey all. Im using @Ionic-native/google-maps, which is working great. I’m also using google autocomplete. In the browser, the results of my autocomplete are showing just fine. I searched the forum for a solution, increasing the z-index of .pac-container. But, when I run on my iOS phone, the results (list of addresses stemming from my searchbar) are not visible.
I have imported the library from google
the places API is enabled in my google developers console as well.
Anyone run into a similar problem and find a solution?
There are no errors being thrown, the map works great, etc. Just no visibility. And again, I did search the forums and googled the issue very thoroughly already…
Edit: sometimes the results show, sometimes they don’t.
Got it working. For anyone else who imports @ionic-native/googlemaps and Google Places, this got things working smoothly and consistently.
Combine your 2 scripts, and add
async defer to the script.
- Script that imports GoogleMaps web API
- Script that imports Google Places API
"https://maps.googleapis.com/maps/api/js?key=******************&callback=initMap" async defer></script>
Place the combined script in your index.html, above
And add to whatever component you’re using your search in, in its’ scss, before anything else
z-index: 10000 !important
Works for me.
Map component achieved with some assistance from @joshmorony’s post:
same problem. Work fine on debug mode (browser) but no on device. Input text but not responding.