title: How to convert an address to longitude and latitude then display a map on the page
body: <p>Im trying to use google maps api to convert my address to longitude and latitude and THEN display the map on the page.</p>
  
  <p>Just a note im using PHP/Laravel to retrieve the address from the DB. So although its a hard coded value of new york that will be dynamic after i get this working.</p>
  
  <p><strong>Html</strong></p>
  
  <pre><code>&lt;div id="map" style="height:250px"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>&lt;script&gt;
  
      var geocoder = new google.maps.Geocoder();
      var address = "new york";
  
      geocoder.geocode( { 'address': address}, function(results, status) {
  
          if (status == google.maps.GeocoderStatus.OK) {
              var latitude = results[0].geometry.location.lat();
              var longitude = results[0].geometry.location.lng();
              alert(latitude);
          }
      });
  
      function initMap() {
          var myLatLng = {lat: latitude, lng: longitude};
  
          var map = new google.maps.Map(document.getElementById('map'), {
              zoom: 4,
              center: myLatLng
          });
  
          var marker = new google.maps.Marker({
              position: myLatLng,
              map: map,
              title: 'Hello World!'
          });
      }
  
  
  
  
  &lt;/script&gt;
  
  &lt;script async defer
          src="https://maps.googleapis.com/maps/api/js?key=keyremoved&amp;callback=initMap"&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>At the moment i'm getting the error of "Uncaught ReferenceError: google is not defined"</p>