滴滴做风控联盟时，需要在地图上标注车辆丢失点，由此对百度地图API做了调研和应用实践。此过程积累了一些经验，特总结如下。

---

【API参考文档】
百度地图API示例：http://developer.baidu.com/map/jsdemo.htm#f0_7
API文档：http://developer.baidu.com/map/reference/index.php?title=Class:%E6%80%BB%E7%B1%BB/%E6%A0%B8%E5%BF%83%E7%B1%BB

使用百度地图API需要申请KEY：http://lbsyun.baidu.com/apiconsole/key

【引入百度地图API】

1. <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=申请的KEY"></script>
   
2. <!--加载鼠标绘制工具-->
   
3. <script type="text/javascript" src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
   
4. <link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
   
5. <!--加载检索信息窗口-->
   
6. <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js"></script>
   
7. <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css" />

复制代码

【加载地图】

1. map = new BMap.Map(domid,{enableMapClick:false});  // 禁止点击地图上原生的点
   
2. var point = new BMap.Point(116.404, 39.915);  // 创建点坐标  
   
3. map.centerAndZoom(point, 13);   
   
4. map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
   
5. map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用
   
6. 
   
7. // 地图控件
   
8. var controllers = [
   
9.     new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT}),
   
10.     new BMap.OverviewMapControl({isOpen:true, anchor:BMAP_ANCHOR_BOTTOM_RIGHT}),
    
11.     new BMap.CityListControl({
    
12.         anchor: BMAP_ANCHOR_TOP_LEFT,
    
13.         onChangeAfter: function(){
    
14.             change_center()
    
15.         }   
    
16.     })  
    
17. ];  
    
18. for (var i=0;i<controllers.length;++i) {
    
19.     map.addControl(controllers[i]);
    
20. }   

复制代码

滴滴做风控联盟时，需要在地图上标注车辆丢失点，由此对百度地图API做了调研和应用实践。此过程积累了一些经验，特总结如下。

---

【API参考文档】
百度地图API示例：http://developer.baidu.com/map/jsdemo.htm#f0_7
API文档：http://developer.baidu.com/map/reference/index.php?title=Class:%E6%80%BB%E7%B1%BB/%E6%A0%B8%E5%BF%83%E7%B1%BB

使用百度地图API需要申请KEY：http://lbsyun.baidu.com/apiconsole/key

【引入百度地图API】

1. <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=申请的KEY"></script>
   
2. <!--加载鼠标绘制工具-->
   
3. <script type="text/javascript" src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
   
4. <link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
   
5. <!--加载检索信息窗口-->
   
6. <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js"></script>
   
7. <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css" />

复制代码

【加载地图】

1. map = new BMap.Map(domid,{enableMapClick:false});  // 禁止点击地图上原生的点
   
2. var point = new BMap.Point(116.404, 39.915);  // 创建点坐标  
   
3. map.centerAndZoom(point, 13);   
   
4. map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
   
5. map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用
   
6. 
   
7. // 地图控件
   
8. var controllers = [
   
9.     new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT}),
   
10.     new BMap.OverviewMapControl({isOpen:true, anchor:BMAP_ANCHOR_BOTTOM_RIGHT}),
    
11.     new BMap.CityListControl({
    
12.         anchor: BMAP_ANCHOR_TOP_LEFT,
    
13.         onChangeAfter: function(){
    
14.             change_center()
    
15.         }   
    
16.     })  
    
17. ];  
    
18. for (var i=0;i<controllers.length;++i) {
    
19.     map.addControl(controllers[i]);
    
20. }   

复制代码