I'm following the introductory tutorial for Google Maps, but for some reason the map is not appearing on my webpage. The relevant HTML/CSS/JS is:
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="main"/>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 400px; height: 400px"></div>
</body>
</html>
The map does not appear within the map_canvas div.
Update
I've changed the page so that it doesn't use JQuery to load the map. It now uses exactly the same JS as in the tutorial, but still the map does not appear.
See Question&Answers more detail:os
