JToland JToland - 1 year ago 85
iOS Question

Google Maps Javascript API Doesn't Respond to Touch Events in iOS 10

I run a website with a number of custom Google Maps built in (showing various locations on a map after a search or generating directions to/from a location). I use Google Maps Javascript API for this. My users have started reporting that on iOS 10, these maps no longer respond to touch events -- they cannot pinch-to-zoom nor can they click on the "pins" on the map to open the location info balloons.

I've been searching all over for others who have had this issue to no avail. I found one StackOverflow question here (http://webcache.googleusercontent.com/search?q=cache:DaiSdOgD0U4J:stackoverflow.com/questions/39401974/google-maps-javascript-doesnt-pan-or-zoom-in-ios-10+&cd=3&hl=en&ct=clnk&gl=us), but it was downvoted, then deleted. (Why?) A fresh search today still shows that page, but it leads to a 404, making a search even more frustrating.

Has anyone else experienced this? Is this a bug within the Google Maps API? I certainly can't find anything about that on their Developer website. Am I possibly doing something very wrong to lead to this? The code has worked for years and hasn't been modified in a few months now, so nothing changed on our end.

  • We do use an API key in our requests

  • I've tried switching from the
    current release version (3.25) to the current experimental version
    (3.26) with no changes in functionality.

  • Users report this happens in at least both Safari and Chrome on iOS 10

Just hoping someone can provide any insight at all on the issue.

Answer Source

Ok here is how I did to fix this issue. As a reminder i'm using AngularJS via the Ionic framework. I was calling the map this way in my index.html :

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyD2Uncn6PvyKHODEThSsuUReOvQk2aHRS0&signed_in=true"></script>

It seams like signed_in feature of google map is adding a layer on the map that is not letting the map getting the X,Y of your screen touch position.

I just replaced by false to disable the signed_in feature and its working like a charm

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyD2Uncn6PvyKHODEThSsuUReOvQk2aHRS0&signed_in=false"></script>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download