簡略的地圖API應用
阿新 • • 發佈:2018-11-23
應用百度地圖的API進行地圖的顯示:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 6 <style type="text/css"> 7 body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微軟雅黑";}8 </style> 9 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=4vydlCU6hHRokokvvSIodhinYsuYna9n"></script> 10 <title>家鄉地圖顯示</title> 11 </head> 12 <body> 13 <div id="allmap"></div> 14 </body> 15 </html> 16<script type="text/javascript"> 17 // 百度地圖API功能 18 var map = new BMap.Map("allmap"); // 建立Map例項 19 map.centerAndZoom(new BMap.Point(116.33,26.33), 11); // 初始化地圖,設定中心點座標和地圖級別 20 //新增地圖型別控制元件 21 map.addControl(new BMap.MapTypeControl({ 22 mapTypes:[ 23 BMAP_NORMAL_MAP,24 BMAP_HYBRID_MAP 25 ]})); 26 map.setCurrentCity("石城縣"); // 設定地圖顯示的城市 此項是必須設定的 27 map.enableScrollWheelZoom(true); //開啟滑鼠滾輪縮放 28 </script>
以上程式碼基本來源於百度地圖。