title: Google MAP API Uncaught TypeError: Cannot read property 'offsetWidth' of null
body: <p>I'm trying to use Google MAP API v3 with the following code.</p>
  
  <pre><code>&lt;h2&gt;Topology&lt;/h2&gt;
  
  &lt;script src="https://maps.google.com/maps/api/js?sensor=false" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;link rel="stylesheet" type="text/css" href="{% url css_media 'tooltip.topology.css' %}" /&gt;
  &lt;link rel="stylesheet" type="text/css" href="{% url css_media 'tooltip.css' %}" /&gt;
  
  &lt;style type="text/css" &gt;
        #map_canvas {
                width:300px;
              height:300px;
       }
  &lt;/style&gt;
  
  &lt;script type="text/javascript"&gt;
  
  var latlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
  zoom: 8,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("map_canvas"),
              myOptions);
  
  &lt;/script&gt;
  
  &lt;div id="map_canvas"&gt; &lt;/div&gt;
  </code></pre>
  
  <p>When I run this code, the browser says this. </p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'offsetWidth' of null</p>
  </blockquote>
  
  <p>I have no idea, since I follow the direction given in <a href="https://developers.google.com/maps/documentation/javascript/tutorial">this tutorial</a>.</p>
  
  <p>Do you have any clue?</p>