<!DOCTYPE html 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>百度地图Demo01</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=9f3caf0f96e461b6e78d6d5bf6c7a425"></script>
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#BaiduMap{ height:600px; width:1000px;}
</style>
<script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function () {
//页面完全加载后执行
}
function btn01() {
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); //设置中心点及缩放级别
}
function btn02() {
map.addControl(new BMap.NavigationControl()); //地图平移缩放控件
}
function btn03() {
map.addControl(new BMap.ScaleControl()); //比例尺控件
map.addControl(new BMap.OverviewMapControl()); //缩略地图控件，默认位于地图右下方，是一个可折叠的缩略地图
map.addControl(new BMap.MapTypeControl()); //地图类型控件
map.setCurrentCity("北京"); // 仅当设置城市信息时，MapTypeControl的切换功能才能可用
}
function btn04() {
map.addControl(new BMap.GeolocationControl()); //定位控件，针对移动设备
}
</script>
</head>
<body>
<div>
<h2>百度地图DEMO</h2>
</div>
<div>
<input id="Button1" type="button" value="设置中心坐标" onclick="btn01();" />
<input id="Button2" type="button" value="添加地图平移缩放控件" onclick="btn02();" />
<input id="Button3" type="button" value="添加其它控件" onclick="btn03();" />
<input id="Button4" type="button" value="添加定位控件（移动设备）" onclick="btn04();" />
</div>
<div id="BaiduMap">
</div>
<script type="text/javascript">
var map = new BMap.Map("BaiduMap"); // 创建地图实例
var point = new BMap.Point(116.404, 39.915); // 创建点坐标
map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别
</script>
</body>
</html>
