Google Map Does Not Show Up Using Geocode Services

I am trying to use Geocode services but for some reason the map does not show up. When I checked the developer console it does not show any Javascript error. This is how the googl

Solution 1:

Do not use undocumented properties of the Google Maps Javascript API v3. They can and do change with every release. Always use the documented methods (.lat(), .lng()).

working fiddle

code snippet::

google.maps.visualRefefresh = true;

var map;

functioninitialize() {
  getCoordinates('287 West Center Street Utah', function(coords) {
    var mapOptions = {
      center: new google.maps.LatLng(coords[0], coords[1]),
      zoom: 8
    };
    map = new google.maps.Map(document.getElementById('map'), mapOptions);
  })

}

google.maps.event.addDomListener(window, 'load', initialize);
var geocoder = new google.maps.Geocoder();

functiongetCoordinates(address, callback) {
  var coordinates;
  geocoder.geocode({
    address: address
  }, function(results, status) {
    coords_obj = results[0].geometry.location;
    coordinates = [coords_obj.lat(), coords_obj.lng()];
    callback(coordinates);
  })
}

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

<scriptsrc="https://maps.googleapis.com/maps/api/js"></script><divid="map"style="height:100%"></div>

Solution 2:

EDIT 1

Change this:

functiongetCoordinates(address,callback) {
    var coordinates;
    geocoder.geocode({address : address} , function (results,status){
        coords_obj = results[0].geometry.location;
        coordinates = [coords_obj.nb, coords_obj.ob];
        callback(coordinates);
    })
}

For this:

functiongetCoordinates(address,callback) {
    var coordinates;
    geocoder.geocode({address : address} , function (results,status){
        coords_obj = results[0].geometry.location;
        coordinates = [coords_obj.H, coords_obj.L];
        callback(coordinates);
    })
}

Your error: coordinates = [coords_obj.nb, coords_obj.ob];

EDIT 2

geocoder = new google.maps.Geocoder();

functiongetCoordinates(address, callback) {
  var coordinates;
  geocoder.geocode({
    address: address
  }, function(results, status) {
    coords_obj = results[0].geometry.location;
    console.log(coords_obj)
    coordinates = [coords_obj.H, coords_obj.L];
    callback(coordinates);
  })
}

google.maps.visualRefefresh = true;

var map;

functioninitialize() {
  getCoordinates('287 West Center Street Utah', function(coords) {
    var mapOptions = {
      center: new google.maps.LatLng(coords[0], coords[1]),
      zoom: 8
    };

    console.log(mapOptions)
    map = new google.maps.Map(document.getElementById('map'), mapOptions);
  })
}

google.maps.event.addDomListener(window, 'load', initialize);

<scriptsrc="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script><divid="map"style="height:900px;width:1000px;"></div>