title: Google Maps Javascript API not rendering
body: <p>I'm trying to follow a tutorial on using the Google Maps API. I believe I have followed the tutorial exactly, but for whatever reason, the map is not rendering. I'm not getting any error messages in the console, so I'm not too sure where to look for more error info.</p>
  
  <p>The following is my HTML:</p>
  
  <pre><code>&lt;body&gt;
  &lt;div class="content"&gt;
      &lt;div id="map" style="width: 100%;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script type="text/javascript" src="https://maps.google.com/maps/api/js?v=3&amp;key=[THE KEY]"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/scripts.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>And the JS:</p>
  
  <pre><code>var map;
  function loadMap(){
  var mapOptions = {
      center: new google.maps.LatLng(28.39404819, -91.38743867),
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.HYBRID
  };
  map = new google.maps.Map(document.getElementById("map"),mapOptions);
  }
  google.maps.event.addDomListener(window, "load", loadMap());
  </code></pre>
  
  <p>Finally, the CSS:</p>
  
  <pre><code>#map {
  height: 75%;
  }
  
  html, body {
      height: 100%;
      margin: 0;
      padding: 0;
  }
  </code></pre>
  
  <p>It's gotta be something small that I'm missing. Any help is greatly appreciated. Thank you!</p>