title: Google Maps error: Oops! Something went wrong. This page didn't load Google Maps correctly
body: <p>First time asking on stackoverflow, so be patient if I break some rule, tried my best to solve by myself searching for a solution, but had no luck. </p>
  
  <p>I used a tool to help me customize a google map with multiple markers location and styles (code below). I test it local and on my own domain and it's working good. 
  When I publish it on the production site, it shows for a while then an error message appear </p>
  
  <blockquote>
    <p>"Oops! Something went wrong. This page didn't load Google Maps correctly. See the >JavaScript console for technical details"</p>
  </blockquote>
  
  <p>Javascript console on Firefox just report an error, I think not related: "API Fullscreen is deprecated"</p>
  
  <p>I tried also by getting a (new) API KEY from Google Developer Console and insert it in the API request link as described in Google documentation (no luck). 
  I verified the ownership of the site on Google Search Console.
  Anyway I think this is not my case, cause domain is recent and console don't report any error about API KEY. </p>
  
  <p>Really wondering what's wrong.
  Here is a demo not working: <a href="http://www.fastdirectlink.com/map.html">http://www.fastdirectlink.com/map.html</a>
  Here is a demo working: <a href="http://tiikeridesign.com/map.html">http://tiikeridesign.com/map.html</a></p>
  
  <p>Here is the code I used </p>
  
  <pre><code>&lt;script src='https://maps.googleapis.com/maps/api/js?key=&amp;sensor=false&amp;extension=.js'&gt;&lt;/script&gt; 
  
  &lt;script&gt; 
      google.maps.event.addDomListener(window, 'load', init);
      var map;
      function init() {
          var mapOptions = {
              center: new google.maps.LatLng(45.0735671,7.67406040000003),
              zoom: 2,
              zoomControl: true,
              zoomControlOptions: {
                  style: google.maps.ZoomControlStyle.DEFAULT,
              },
              disableDoubleClickZoom: false,
              mapTypeControl: true,
              mapTypeControlOptions: {
                  style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
              },
              scaleControl: true,
              scrollwheel: true,
              panControl: true,
              streetViewControl: true,
              draggable : true,
              overviewMapControl: true,
              overviewMapControlOptions: {
                  opened: true,
              },
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              styles: [
  
    {
  
      "featureType": "water",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "color": "#d3d3d3" }
  
      ]
  
    },{
  
      "featureType": "transit",
  
      "stylers": [
  
        { "color": "#808080" },
  
        { "visibility": "off" }
  
      ]
  
    },{
  
      "featureType": "road.highway",
  
      "elementType": "geometry.stroke",
  
      "stylers": [
  
        { "visibility": "on" },
  
        { "color": "#b3b3b3" }
  
      ]
  
    },{
  
      "featureType": "road.highway",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "color": "#ffffff" }
  
      ]
  
    },{
  
      "featureType": "road.local",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "visibility": "on" },
  
        { "color": "#ffffff" },
  
        { "weight": 1.8 }
  
      ]
  
    },{
  
      "featureType": "road.local",
  
      "elementType": "geometry.stroke",
  
      "stylers": [
  
        { "color": "#d7d7d7" }
  
      ]
  
    },{
  
      "featureType": "poi",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "visibility": "on" },
  
        { "color": "#ebebeb" }
  
      ]
  
    },{
  
      "featureType": "administrative",
  
      "elementType": "geometry",
  
      "stylers": [
  
        { "color": "#a7a7a7" }
  
      ]
  
    },{
  
      "featureType": "road.arterial",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "color": "#ffffff" }
  
      ]
  
    },{
  
      "featureType": "road.arterial",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "color": "#ffffff" }
  
      ]
  
    },{
  
      "featureType": "landscape",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "visibility": "on" },
  
        { "color": "#efefef" }
  
      ]
  
    },{
  
      "featureType": "road",
  
      "elementType": "labels.text.fill",
  
      "stylers": [
  
        { "color": "#696969" }
  
      ]
  
    },{
  
      "featureType": "administrative",
  
      "elementType": "labels.text.fill",
  
      "stylers": [
  
        { "visibility": "on" },
  
        { "color": "#737373" }
  
      ]
  
    },{
  
      "featureType": "poi",
  
      "elementType": "labels.icon",
  
      "stylers": [
  
        { "visibility": "off" }
  
      ]
  
    },{
  
      "featureType": "poi",
  
      "elementType": "labels",
  
      "stylers": [
  
        { "visibility": "off" }
  
      ]
  
    },{
  
      "featureType": "road.arterial",
  
      "elementType": "geometry.stroke",
  
      "stylers": [
  
        { "color": "#d6d6d6" }
  
      ]
  
    },{
  
      "featureType": "road",
  
      "elementType": "labels.icon",
  
      "stylers": [
  
        { "visibility": "off" }
  
      ]
  
    },{
  
    },{
  
      "featureType": "poi",
  
      "elementType": "geometry.fill",
  
      "stylers": [
  
        { "color": "#dadada" }
  
      ]
  
    }
  
  ],
          }
          var mapElement = document.getElementById('map-canvas');
          var map = new google.maps.Map(mapElement, mapOptions);
          var locations = [
  ['Headquarter', '&lt;address&gt;Via Ottavio Assarotti, 10 - Torino &lt;br /&gt; 10122 Italy&lt;/address&gt;', 'Phone: +39 011 549444', 'undefined', 'undefined', 45.0735671, 7.67406040000003, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png'],['Offices - Europe', 'Str. del Redentore Alto, 157 Moncalieri TO\"&lt;br /&gt;10024 Italy', 'Phone: +39 011 0603933 &lt;br /&gt; Mobile: +39 335 8291680', 'fastdirectlink@legalmail.com &lt;br /&gt; g.manzo@fastdirectlink.com', 'undefined', 45.026912, 7.735915, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png'],['Russia', 'Alberto Fiocchi&lt;br /&gt;16, Teterinskiy Pereulok &lt;br /&gt;109004 Moscow (Russia)', 'Mobile: +7 985 8546283', 'albe.fiocchi@gmail.com', 'undefined', 55.7453888,  37.65318679999996, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png'],['China', 'Ines Tammaro&lt;br /&gt;Yangtze river international garden phase II&lt;br /&gt;Shanghai China', 'Phone: +86 158 9648 1992  Mobile: +86 331 2166946', 'i.tammaro@fastdirectlink.com', 'undefined', 31.104447, 121.432655, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png'],['USA', 'Jerry Yocum&lt;br /&gt;835, Bunty Station Road,&lt;br /&gt;43015 Delaware, OH – USA', 'Phone: +1 (614) 7361111', 'jerryyocum835@yahoo.com', 'undefined', 40.250594,  -83.07493899999997, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png'],['ASIAN', 'Hubert Fournier&lt;br /&gt;116, Middle Road, ICB Enterprise House,&lt;br /&gt;#08-03/04, 188972 Singapore', 'Phone: (65) 63339833', 'italia@optimconsulting.net', 'undefined', 1.2992375,  103.7835042, 'https://mapbuildr.com/assets/img/markers/solid-pin-blue.png']
          ];
          for (i = 0; i &lt; locations.length; i++) {
              if (locations[i][1] =='undefined'){ description ='';} else { description = locations[i][1];}
              if (locations[i][2] =='undefined'){ telephone ='';} else { telephone = locations[i][2];}
              if (locations[i][3] =='undefined'){ email ='';} else { email = locations[i][3];}
             if (locations[i][4] =='undefined'){ web ='';} else { web = locations[i][4];}
             if (locations[i][7] =='undefined'){ markericon ='';} else { markericon = locations[i][7];}
              marker = new google.maps.Marker({
                  icon: markericon,
                  position: new google.maps.LatLng(locations[i][5], locations[i][6]),
                  map: map,
                  title: locations[i][0],
                  desc: description,
                  tel: telephone,
                  email: email,
                  web: web
              });
  link = '';            bindInfoWindow(marker, map, locations[i][0], description, telephone, email, web, link);
       }
   function bindInfoWindow(marker, map, title, desc, telephone, email, web, link) {
        var infoWindowVisible = (function () {
                var currentlyVisible = false;
                return function (visible) {
                    if (visible !== undefined) {
                        currentlyVisible = visible;
                    }
                    return currentlyVisible;
                 };
             }());
             iw = new google.maps.InfoWindow();
             google.maps.event.addListener(marker, 'click', function() {
                 if (infoWindowVisible()) {
                     iw.close();
                     infoWindowVisible(false);
                 } else {
                     var html= "&lt;div style='color:#000;background-color:#fff;padding:5px;width:150px;'&gt;&lt;h4&gt;"+title+"&lt;/h4&gt;&lt;p&gt;"+desc+"&lt;p&gt;&lt;p&gt;"+telephone+"&lt;p&gt;&lt;a href='mailto:"+email+"' &gt;"+email+"&lt;a&gt;&lt;/div&gt;";
                     iw = new google.maps.InfoWindow({content:html});
                     iw.open(map,marker);
                     infoWindowVisible(true);
                 }
          });
          google.maps.event.addListener(iw, 'closeclick', function () {
              infoWindowVisible(false);
          });
   }
  }
  &lt;/script&gt;
  &lt;style&gt;
      #map-canvas {
          height:400px;
          width:1024px;
      }
      .gm-style-iw * {
          display: block;
          width: 100%;
      }
      .gm-style-iw h4, .gm-style-iw p {
          margin: 0;
          padding: 0;
      }
      .gm-style-iw a {
          color: #4272db;
      }
  &lt;/style&gt;
      &lt;div id="map-canvas"/&gt;
  </code></pre>