百度地图（3）-添加地图控件
1. 百度地图API提供了一些默认的Control，可以直接进行添加，省去了不少代码量。
具体可参考官方文档：http://lbsyun.baidu.com/index.php?title=jspopular3.0/guide/widget
2. 还有一些其它的封装好的控件，如：交通流量、全景图、
可以在地图初始化后，直接向 map 中添加相应的控件。
1 /** 2 * 添加地图控件 3 **/ 4 function addMapControls() { 5 6 7 //添加地图导航控件 8 map.addControl(new BMap.NavigationControl()); 9 10 //添加地图比例尺控件 11 12 /** 13 * 比例尺工具与版本标识工具所用同一个class，anchorBL, 所以，当采用CSS方式 display:none 去掉左下角 14 * 的百度标识和版权标识时，缩放比例工具也会被隐藏。 15 **/ 16 var opts = {offset: new BMap.Size(150, 5)} 17 map.addControl(new BMap.ScaleControl(opts)); 18 19 /** 20 * 添加鹰眼图 21 */ 22 map.addControl(new BMap.OverviewMapControl()); 23 24 /** 25 * 此种方法添加为三种类型，地图/卫星/三维，其中切换至三维时无法显示地图，也无官方文档所说的切换城市 26 * 不建议采用此种方法 27 */ 28 // map.addControl(new BMap.MapTypeControl()); 29 // map.setCurrentCity("合肥"); 30 31 //添加地图控件, 矢量图和卫星图。 矢量图为卫星地图+矢量标注 32 map.addControl(new BMap.MapTypeControl({ 33 mapTypes: [ 34 BMAP_NORMAL_MAP, //矢量图 35 //BMAP_SATELLITE_MAP,//卫星图， 此选项不起作用 36 BMAP_HYBRID_MAP //混合图， 卫星+矢量图中的街道和标注 37 ] 38 })); 39 40 /** 41 * 添加交通流量图 42 */ 43 addTrafficControl(); 44 }
注意：
3. TrafficControl 在 BMapLib 库中，引用可参考代码。
1 <link rel="stylesheet" href="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.css"/> 2 <script type="text/javascript" src="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.js"></script>
4. ScaleControl 的样式比较简单，很容易被其他图片颜色或者字体影响，可以自己修改样式，本文没有提供修改方式。
5. MapTypeControl 如果直接使用 map.addControl(new BMap.MapTypeControl())，出来的有三维地图的选项，但是点击时，并不能显示三维地图。
使用第二种方法，指定地图类型，里面有三种类型，
BMAP_NORMAL_MAP
BMAP_SATELLITE_MAP,
BMAP_HYBRID_MAP
这里只选了 Normal 和 HYBIRD。
6. 全景图参见后面的全景图的文章。
7.. 页面显示
