<!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" /> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/LuShu/1.2/src/LuShu_min.js"></script> <title>29.1 添加控件</title> </head> <body> <div class="wrapper"> <div class="container clearfix"> <div class="clearfix"> <div style="clear: both;"> <div style="float: left; width: 500px; height: 340px; border: 1px solid gray" id="container"> </div> </div> </div> </div> </div> </body> </html> <script type="text/javascript"> var map = new BMap.Map("container"); // 創建地圖實例 var point = new BMap.Point(116.404, 39.950507); // 創建點坐標 map.centerAndZoom(point, 16); // 初始化地圖，設置中心點坐標和地圖級別 map.addControl(new BMap.OverviewMapControl({ isOpen: 1 })); //為地圖添加鷹眼 //map.addControl(new BMap.NavigationControl()); //為地圖添加魚骨（默認） map.addControl(new BMap.NavigationControl({ type: BMAP_NAVIGATION_CONTROL_SMALL })); //為地圖添加魚骨（迷你型） //map.addControl(new BMap.ScaleControl()); //添加一個帶上偏移量的比例尺 map.addControl(new BMap.ScaleControl({ offset: new BMap.Size(5, 40) })); //添加一個帶上偏移量的比例尺 map.addControl(new BMap.MapTypeControl()); //為地圖添加2D3D切換控件 map.setCurrentCity("北京市"); // 僅當設置城市信息時，MapTypeControl的切換功能才能可用 var myCopyright = new BMap.CopyrightControl({ offset: new BMap.Size(82, 0) }); //設置版權信息偏移量 map.addControl(myCopyright); //為地圖添加版權控件 myCopyright.addCopyright({ id: 1, content: '<a style="line-height:30px;height:30px;display:block;color:red;background:yellow" href="http://www.cnblogs.com"><img src="http://www.ui-love.com/static/img/uiico.ico" />博客園</a>' }); </script>