Peppered Lemons Peppered Lemons - 6 months ago 42
Javascript Question

Google map error: a is null

I have a program that I want to use google maps for. The problem is I get an error that says a is null where a is a var used in the google map api. Here is how I call my google map:

//Creates a new center location for the google map
var latlng = new google.maps.LatLng(centerLatitude, centerLongitude);

//The options for the google map
var myOptions = {
zoom: 7,
maxZoom: 12,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};

//Creates the new map
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);


And here is what my HTML tag looks like:

<div id = "map_canvas"></div>


I get the lat and lng on page load through the url. These values are passed in correctly so I know that is not the problem. I think that it has to do with the
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
not being correct. Any suggestions?

EDIT: Here is the error message:


a is null
fromLatLngToPoint(a=null)
yg(a=null, b=Object { zoom=7, maxZoom=12, more...})
d(d=Document Default.aspx?lat=30.346317&lng=105.46313, f=[function()])
d(a=undefined)
d()
[Break On This Error] function Qf(a){a=a.f[9];return a!=i?a:...);function sg(a){a[ic]&&a[ic]Vb}

Answer

Make sure you specify the size of your div that holds a map. For example:

<div id = "map_canvas" style="width: 500px;height: 500px"></div>

Further make sure that your map variable is defined in global scope and make sure you do initialize the map when dom loaded (<body onload=yourinit()>)

Comments