CODEWITHSUNDEEP
javascriptjquerygoogle-maps
user517406
user517406

Reputation: 13773

Loading Google Maps

I am trying to load Google Maps in my Javascript, but I keep getting the error 'document.body is null'. Can anybody help?

<html>

<head>

</head>

<body>

<div></div>

</body>

</html>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?key=gfgfgfgfgfg"></script>


<script type="text/javascript">

    $(document).ready(function () {

    google.load('maps','3', {other_params: "sensor=false&callback=mapsLoaded&key=gfgfgfgfgf"});


});

    function mapsLoaded()
    {
        alert("done");
    }

</script>

Upvotes: 2

Views: 1405

Answers (3)

pdjota
pdjota

Reputation: 3243

To get information of a certain position, and not drawing a map it is better to use Google's geocoding services:

    ll = new google.maps.LatLng(-34.397, 150.644);
    geocoder = new google.maps.Geocoder();
    geocoder.geocode({ latLng: ll}, function(res, status){
      console.log(status);
      console.log(res);
    });

For more details on other params please take a look at the API:

http://code.google.com/apis/maps/documentation/javascript/geocoding.html#GeocodingRequests

Hope it helps.

Upvotes: 0

pdjota
pdjota

Reputation: 3243

For the version 3 of the API you should try a different approach:

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=drawing"></script>
<script type="text/javascript">
$(document).ready(function () {
    var myOptions = {
      center: new google.maps.LatLng(-34.397, 150.644),
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);
});
</script>
</head>
<body>
<div id='map_canvas' style="width:450px; height:450px"></div>
</body>
</html>

Upvotes: 1

Rich O&#39;Kelly
Rich O&#39;Kelly

Reputation: 41757

Move your script to inside the closing body tag:

<html>
  <head>...</head>
  <body>
    ...
    <script> ... </script>
  </body>
</html>

Upvotes: 0

Related Questions