Google Maps API does not always load until my page is refreshed

Viewed 1013

I am having an intermittent issue where my Google Map will not load upon initially loading the webpage, causing a blank map. On refresh it will load without issue.

This is the error message I am getting in the Chrome console:

message: "initMap is not a function"
name: "InvalidValueError"

HTML for my map:

   <div class="container-fluid">
     <div id="map"> </div> 
   </div>

JavaScript:

function initMap() {
                var uluru = {lat: 28.0394654 , lng: -81.94980420000002};
                var map = new google.maps.Map(document.getElementById('map'), {
                  zoom: 10,
                  center: uluru,
                  //disableDefaultUI: true,
                  gestureHandling: 'cooperative'

                });
                var marker = new google.maps.Marker({
                  position: uluru,
                  map: map
                });

                var triangleCoords = [
                    {lat: 28.0990114, lng: -82.0035785}, //Kathleen Rd - Lakeland 
                    {lat: 28.0186323, lng: -82.11286410000002}, //Plant City 
                    {lat: 27.8953038, lng: -81.97341719999997}, //Mulberry 
                    {lat: 27.8964147, lng: -81.84313739999999}, //Bartow 
                    {lat: 27.9014133, lng: -81.58590989999999},//Lake Wales 
                    {lat: 28.1141841, lng: -81.61785359999999}, //Haines City 
                    {lat: 28.1825147, lng: -81.8239676} //Polk City 
                  ];

                 var expressCoverage = new google.maps.Polygon({
                    paths: triangleCoords,
                    strokeColor: '#333333',
                    strokeOpacity: 0.8,
                    strokeWeight: 2,
                    fillColor: '#333333',
                    fillOpacity: 0.2
                  });
                  expressCoverage.setMap(map);

                }

I've cleared the cache in my browser with no effect on the issue. The problem persists in Chrome, Mozilla and Mobile Safari. Could something be happening with the API Key when the map is not loading?

1 Answers
Related