Question

I’m updating some old code to Google Maps API v3, and I can’t get the map to show anything. Dumping the map object to the console shows the map has been initialized properly and it is supposed to be loading in the proper div– but nothing shows except a grey box.

I have set width/height and overflow for the map div, since this seems to be the most common problem.

However, I can’t get this to work. Any ideas?

http://jsfiddle.net/Nbjrf/1/

Thanks

Answer 1

You had the mapTypeId constant in quotes, ‘google.maps.MapTypeId.HYBRID’; it’s a constant, not a string: google.maps.MapTypeId.HYBRID

Also, you need to supply a map centre, and a zoom level. This works:

var mapInitOpts = {
    mapTypeId: google.maps.MapTypeId.HYBRID,
    center: new google.maps.LatLng(-32.891058,151.538042),
    zoom: 16
};

map = new google.maps.Map(document.getElementById("map_canvas"), mapInitOpts);

Finally, you don’t need to supply an API key any more.