Google Maps - Asynchronous Loading

Google Maps JavaScript API v3 - Asynchronous Loading

<!DOCTYPE html>
 <html>
  <head>
    <title>Asynchronous Loading</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map-canvas {
		width: 640px;
		height: 300px;
                margin: 0px;
                padding: 0px;
		}
		#map-canvas {
		background-image: url("https://maps.googleapis.com/maps/api/staticmap?center=46.8,8&zoom=7&size=808x300&maptype=default&style=feature:all|element:labels|visibility:on&markers=icon:http://maps.google.com/mapfiles/ms/icons/red-dot.png%7Ccolor:red%7C");
		}
    </style>
    <script>
function initialize() {
  var mapOptions = {
    zoom: 7,
    center: new google.maps.LatLng(46.8, 8)
  };
 
  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
 }
 
function loadScript() {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp' +
      '&signed_in=true&callback=initialize';
  document.body.appendChild(script);
 }
 
 window.onload = loadScript;
 
    </script>
  </head>
  <body>
    <h1>Asynchronous Loading</h1>
    <div id="map-canvas"></div>
  </body>
 </html>

<html>

<head>
  <title>Asynchronous Loading</title>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <style>
    html1, body1, #map-canvas {
	width: 640px;
	height: 300px;
              margin: auto;
              padding: 0px;
	}
	#map-canvas {
	background-image: url("https://maps.googleapis.com/maps/api/staticmap?center=46.8,8&zoom=7&size=808x300&maptype=default&style=feature:all|element:labels|visibility:on&markers=icon:http://maps.google.com/mapfiles/ms/icons/red-dot.png%7Ccolor:red%7C");
	}

  </style>
  <script>

function initialize() {

var mapOptions = {
  zoom: 7,
  center: new google.maps.LatLng(46.8, 8)
};

var map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);

}

function loadScript() {

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp' +
    '&signed_in=true&callback=initialize';
document.body.appendChild(script);

}

window.onload = loadScript;

  </script>
</head>
<body>
  <h1>Asynchronous Loading</h1>
  <div id="map-canvas"></div>
</body>

</html>

Source https://developers.google.com/maps/documentation/javascript/examples/map-simple-async