title: Creating Google Map instance in typescript class
body: <p>Hi I'm new to Typescript and Javascript and I'm having a few problems creating a googlemap instance.</p>
  
  <p>I've downloaded the <a href="http://nuget.org/packages/google.maps.d.ts/">google.maps.d.ts</a> declaration file and imported it to my typescript class like so, all the intellisense works fine etc.;</p>
  
  <pre><code>import googleMaps = module("google.maps"); 
  module Mapping {
      export class GoogleMap implements IMap {
  
          public name: string;
          private map: any;
          private options: any;
  
          constructor (mapDiv:Element) {
              this.name = "GoogleMap";
              this.options = { zoom: 3, MapTypeId: 'terrian' };
              this.map = new googleMaps.google.maps.Map(mapDiv, this.options);
           }
      }
  }
  </code></pre>
  
  <p>When I try to create this class in my index.cshtml file ;</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;&lt;title&gt;TypeScript Mapping&lt;/title&gt;&lt;/head&gt;
      &lt;script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?    key=MYKEYGOESHERE&amp;sensor=false"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="~/scripts/require.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="~/typings/Mapping.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          function initialize() {
  
              var mapCanvas = document.getElementById("map");
  
              var googleMap = new Mapping.GoogleMap(mapCanvas);
          }
      &lt;/script&gt;
  &lt;body onload="initialize()"&gt;
  &lt;div id="map" style="height: 512px; width: 512px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>I get the following error ;</p>
  
  <p>Microsoft JScript runtime error: Module name "google.maps" has not been loaded yet for context: _. Use require([])</p>
  
  <p>What am I missing in order to load the googlemaps api?</p>
  
  <p>Thanks in advance.</p>