title: JavaScript Google Maps API - Center on User's Location not loading map
body: <p>I've posted before but I wanted to update the question, I tried to delete the other question but I had to flag it do that so I left it alone.
  <strong>I have a key for the Google Map API, but the map will not appear or load.</strong>
  Here is my code:</p>
  
  <p><strong>Index.html</strong></p>
  
  <pre><code>&lt;script src = "loc.js"&gt;&lt;/script&gt;
  &lt;input type ="button" value="Get Location" onclick="getLocation();"&gt;
  &lt;div id="spot"&gt;&lt;/div&gt;
  &lt;script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDEiqN2L1odkK645Il8bBVCDqatth6aZyU&amp;callback=getLocation"&gt;&lt;/script&gt;
  &lt;div id="map" style="width:100%;height:400px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>loc.js</strong></p>
  
  <pre><code>function getLocation() {
      var userSpot = document.getElementById("spot");
      var map = document.getElementById("map");
      //Using navigator, retrieves the users current location (works better with mobile phones)
      if (navigator.geolocation) { //If the user says no (this prompts the user if they want their location known)
                                  //then it'll go ahead and retrieve their location, if not prompts error message.
          navigator.geolocation.getCurrentPosition(showLocation);
  
          var currPosLat = position.coords.latitude; 
          var currPosLng = position.coords.longitude;
  
          var mapOptions = { 
          center: new google.maps.LatLng(currPosLat, currPosLng),
          zoom:12, 
          }; 
  
          var map = new google.maps.Map(document.getElementById("map"), mapOptions);
      } else { 
          userSpot.innerHTML = "Geolocation is not supported by this browser type.";
      }
  }
  
  function showLocation(position) {
      var userSpot = document.getElementById("spot");
      //Retrieves latitude and longitude using this second function called in the first
      userSpot.innerHTML = "Latitude: " + position.coords.latitude + 
      "&lt;br&gt;Longitude: " + position.coords.longitude;
  }
  </code></pre>