Use Google API to call Google Maps Demo 1

<!DOCTYPEhtml PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

< html xmlns="http://www.w3.org/1999/xhtml"> < head >      < title >演示1</ title >      < meta name="viewport" content="initial-scale=1.0, user-scalable=no" />      < style type="text/css">          html { height: 100%; }          body { height: 100%; margin: 0px; padding: 0px; }          #map_canvas { width:50%; height: 50%; margin: 50px auto; }      </ style >      < script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&key=ABQIAAAAtzdEfkm0e6fFv-EqYY-XJRQdNSJsfUEFgMWL1fb2TrZ8t0A2pRQ10wAqRsmxpdHzRsHswMJAFavZ6g"></ script >      <!-- sensor 参数表示是否检测用户的地理位置 -->      < script type="text/javascript">          function initialize()          {              var latlng = new google.maps.LatLng(22.95, 113.4); /* 广州市番禺区，分别为纬度和经度，常德的经纬度为：29,111.7 */              var myOptions = {                  zoom: 12,    /* zoom 的取值范围为：0-19，表示范围最广，19表示范围最小但同时最详细 */                  center: latlng,                  //disableDefaultUI: true,     /* 是否禁用缩放滚动条和“地图”、“卫星”、“混合”、“地形”，默认为false */                  mapTypeControl: true,           /* 是否出现“地图”、“卫星”、“混合”、“地形”，默认为true */                  mapTypeControlOptions:                  {                      style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,    /* 以下拉框的形式显示“地图”、“卫星”、“混合”、“地形”，默认值为“google.maps.MapTypeControlStyle.HORIZONTAL_BAR” */                      position: google.maps.ControlPosition.RIGHT        /* 显示的位置，默认为RIGHT */                  },                  navigationControl: true,        /* 是否启用缩放滚动条，默认为true */                  navigationControlOptions:                  {                      style: google.maps.NavigationControlStyle.SMALL,     /* 已最简单的形式显示缩放滚动条 */                      position: google.maps.ControlPosition.TOP_LEFT     /* 显示的位置 */                  },                  scaleControl: true,          /* 是否等比例缩放 */                  scaleControlOptions:                  {                       /* position: google.maps.ControlPosition.TOP_LEFT */                  },                  mapTypeId: google.maps.MapTypeId.ROADMAP        /* google.maps.MapTypeId.TERRAIN 表示“地形” */                  /*                  mapTypeControlOptions:                  {                       mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.TERRAIN]                  }                  */              };              var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);          }      </ script > </ head > < body onload="initialize()">      < div id="map_canvas">      </ div > </ body > </ html >

Use Google API to call Google Maps Demo 1