google地图简单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDdIlaRp0Dm8cEP8oXZ_8HLuj_zpccK7gw&sensor=true">
    </script>
    <script type="text/javascript">
        function initialize() {
            var mapOptions = {
                center: new google.maps.LatLng(-34.397, 150.644),
                zoom: 8,
                //mapTypeId: google.maps.MapTypeId.ROADMAP
                mapTypeId: google.maps.MapTypeId.SATELLITE 
                //mapTypeId: google.maps.MapTypeId.HYBRID 
                //mapTypeId: google.maps.MapTypeId.TERRAIN 
            };
            var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);

        }

        function loadScript() {
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "http://maps.googleapis.com/maps/api/js?key=AIzaSyDdIlaRp0Dm8cEP8oXZ_8HLuj_zpccK7gw&sensor=true&callback=initialize";
            document.body.appendChild(script);
        }

        window.onload = loadScript;
        //google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>
<body>
<div id="map-canvas"  style="width: 60%; height: 80%"/>
</body>
</html>

 

posted @ 2013-05-15 20:13  louiskoo  阅读(242)  评论(0编辑  收藏  举报