Running into a tiny hiccup.
On this page I have a Google map built with ACF that connects via the Google API.
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDIdDn1wrUrexbGza-tOeMEn65lql82yHM&loading=async&callback=Function.prototype" async></script>
What I’ve noticed is that sometimes I get a Google not defined error on the map which causes it not to load. This happens sometimes on Chrome, but always on Safari. I have tried multiple things including:
- Adding ‘loading=async’ plus async and defer to the script tag
- Triggering a map resize to get map to show again.
- Loading it via https and Http
- Loading the google maps API script in header.
If you view the page on Safari it breaks, on Chrome it works fine most of the time.
Any help would be of guidance. You can see the JS code in the inspector on the page. Thank you in advance.