title: google is not defined google maps
body: <p>I'm trying to extend my prototype function from google.maps.Map object. But I'm getting the Cannot read property 'firstChild' of undefined.</p>
  
  <p>Basically I just want to add a custom prototype object that is also an instance of google.maps.Map Below is my code</p>
  
  <pre><code>&lt;script src="https://maps.googleapis.com/maps/api/js?key=MY_KEY&amp;callback=initMap&amp;libraries=drawing" async defer&gt;&lt;/script&gt;
  
  function Map(id, options) {
      this.id = id;
      this.latlng = options.center;
  }
  
  Map.prototype = new google.maps.Map;
  
  function initMap()
  {
      map = new Map('map', mapOptions);
  }
  </code></pre>
  
  <p>and here's the error I'm getting<a href="https://i.stack.imgur.com/croot.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/croot.png" alt="enter image description here"></a></p>
  
  <p>So what I like is when I run 'new Map('map', mapOptions)' this will create a new google.maps.Map(); instance and this will render a map. But I'm not sure what I'm missing here as I'm fairly new to using prototype in javascript. Hope you can help me with this. Thanks</p>