Ad

Googlemaps Listener Loading Fine In Firefox But Not In Other Browsers

I'm loading the googlemaps api

<script async defer
    src="https://maps.googleapis.com/maps/api/js?key=oxD34DBEEF_KbuMvCv3koum4ntaRia8GdIUwE&callback=initMap">
</script>

to draw a map

<script type="text/javascript">
var map;
    function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
        ...
        });
    }
</script>

and then I define a listener to register the latitude/longitude of any clicks on the map.

function getLatLon() {
            listener1 = google.maps.event.addListener(map, 'click', function (event) {...})
}
...
getLatLon();

This works fine on Firefox but on Chromium and IE I get an error "google is not defined". I tried repositioning the script that loads the api but no success. Making it load synchronously results in the map not being displayed.

Thanks for helping.

Ad

Answer

google APIs can only be used until the callback is called so you need to put the getLatLon() method inside the initmap() to avoid "google is not defined" error.

it has to be something like the code below

<script type="text/javascript">
var map;
    function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          ....
        });

        getLatLon();
    }
</script>
Ad
source: stackoverflow.com
Ad