Erik Verboom Erik Verboom - 3 months ago 25
Android Question

Google maps javascript api bug android browser (Jelly bean and prior)

So, this question concerns only the old android browser (before chrome became the standard browser) and the google maps javascript api v3.

I am developing a website, together with an app with a webview, showing (parts of) that website.

Lately, the google map windows that are included in the website have stopped working properly. The map shows up, but any touch event on the map, like dragging the map to show other locations, as well as two finger zoom are not working anymore. the error that is shown in the javascript console (on every touch event on the map) is:

Uncaught TypeError: Illegal constructor -- From line 125 of http://maps.googleapis.com/maps-api-v3/api/js/26/2/intl/nl_ALL/common.js


After a days of looking for bugs in my code it seems to me that this could be a bug in the google maps javascript api. The error occurs not only on my website, but on all embedded google maps that i could find. Even in google's own api documentation.
The error only occurs in the old standard android browser, but old android versions are still in use quite commonly, and i cannot tell my users to switch to another browser because it has to work in a webview as well.

I could reliably reproduce this issue on a samsung xcover 2 (gt-s7710, android 4.1.2) and an api 17 simulator (android 4.2) in this link: https://developers.google.com/maps/documentation/javascript/

Has anyone else encountered this problem and/or found a workaround?

Answer

i had the same problem as you described.

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:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=API-KEY&libraries=geometry,places"></script>

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.

I hope this helps you also.

Best wishes