1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 </head> 7 <body> 8 <!--Baidu map Start--> 9 <div class="baidu-map-area section-padding" id="map" style=" 100%; height: 100%;"></div> 10 <!--引用百度地图API--> 11 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=自己申请的百度地图api秘钥"></script> 12 <script type="text/javascript"> 13 //创建和初始化地图函数： 14 function initMap(){ 15 createMap();//创建地图 16 setMapEvent();//设置地图事件 17 addMapControl();//向地图添加控件 18 addMapOverlay();//向地图添加覆盖物 19 } 20 function createMap(){ 21 map = new BMap.Map("map"); 22 map.centerAndZoom(new BMap.Point(116.302042,39.908469),16); 23 } 24 25 function setMapEvent(){ 26 map.enableScrollWheelZoom(); 27 map.enableKeyboard(); 28 map.enableDragging(); 29 map.enableDoubleClickZoom() 30 } 31 function addClickHandler(target,window){ 32 target.addEventListener("click",function(){ 33 target.openInfoWindow(window); 34 }); 35 } 36 function addMapOverlay(){ 37 } 38 //向地图添加控件 39 function addMapControl(){ 40 var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE}); 41 map.addControl(navControl); 42 43 44 var point = new BMap.Point(116.302042,39.908469); //将标注点转化成地图上的点 45 var marker = new BMap.Marker(point); //将点转化成标注点 46 map.addOverlay(marker); //将标注点添加到地图上 47 48 } 49 50 51 var map; 52 initMap(); 53 </script> 54 <!--Baidu map End--> 55 </body> 56 </html>
复制出来就可以查看地图