參考網址： http://developer.baidu.com/map/index.php?title=jspopular/guide/widget
1.申請密鑰(ak)
http://api.map.baidu.com/api?v=1.4 //參數v表示您加載API的版本，使用JavaScript APIv1.4及以前版本可使用此方式引用。
http://api.map.baidu.com/api?v=2.0&ak=您的密鑰 //使用JavaScript APIv2.0請先申請密鑰ak，按此方式引用。
2.基礎使用
加載的js文件：<script src="http://api.map.baidu.com/api?v=2.0&ak=您的密鑰" type="text/javascript"></script>
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Hello, World</title> <style type="text/css"> html{height:100%} body{height:100%;margin:0px;padding:0px} #container{height:100%} </style> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=xxx"> </script> </head> <body> <div id="container"></div> <script type="text/javascript"> var map = new BMap.Map("container"); // 創建地圖實例 var point = new BMap.Point(116.404, 39.915); // 創建點坐標 map.centerAndZoom(point, 15); // 初始化地圖，設置中心點坐標和地圖級別 </script> </body> </html>
開發移動平台上的地圖應用：
（1）將地圖容器高設置為100%，使其充滿整個屏幕，或者您也可以計算瀏覽器窗口的大小並進行設置。
（2）添加下面的meta標簽： <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 這樣做是為了讓頁面以正常比例進行顯示並且禁止用戶縮放頁面的操作。
基礎添加：
（1）創建地圖實例：var map=BMap.Map("#container");
（2）創建坐標點：var point =BMap.Point(116.404,39,915);
（3）地圖初始化：map.centerAndZoom(point,15); //要求設置中心坐標點及地圖級別
（4）其他操作：map.enableScrollWheelZoom--鼠標滾輪控制縮放（更多在 Map類參考的配置方法）