mdmc187
September 1, 2016, 8:39am
1
Hello,
im new to Ionic and im trying to setup a google maps with google maps Javascript v3 API.
My Problem:
for some reason the panning is not working on my android device. If i use my finger to touch the display and try to pan the map, nothing happens. The Google Maps controls are working, for example: i can touch the zoom control to zoom in and out.
Its working in my Chrome Browser.
My Maps View:
> <ion-view>
> <ion-content>
> <div id="map" data-tap-disabled="true"></div>
> </ion-content>
> </ion-view>
The Controller:
> .controller('MapCtrl', function($scope) {
> $scope.map = new google.maps.Map(document.getElementById('map'), {
> center: {lat: -34.397, lng: 150.644},
> zoom: 8
> });
>
> });
Anyone knows how i can fix this ?
Thank you
mdmc187
September 1, 2016, 9:58pm
2
UPDATE! FOUND WORKAROUND
Explanation:
At least i found a simple workaround (after hours of headache).
I just found out, that Google Maps Javascript API has 3 API References.
The “Experimental Version”, “Release Version” and the “Frozen Version”.
If you include the API without specifying the exact version, it will use the “Experimental Version” by default.
As i noticed, this version (3.26) got an Update on 30. of August 2016 which seems to cause the bug.
SOLUTION:
Just change your API from:
src=“http://maps.google.com/maps/api/js?key=API-KEY&libraries=geometry,places ”
to
src=“http://maps.google.com/maps/api/js ?v=3 &key=API-KEY&libraries=geometry,places”
Now its using the “Release Version” (last change on 17. of August 2016) of the API.
Source: https://developers.google.com/maps/documentation/javascript/versions
For me it works now on Android 4.3 (API Level 18) with cordova.
Best wishes
1 Like