最近要在微信增加地图功能，尝试了一下百度地图。下面仅对自己用到的功能进行了简单整理，方便自己查阅使用。
官方文档已经十分详细，更多信息可以直接查看：
概述：http://lbsyun.baidu.com/index.php?title=jspopular
示例：http://developer.baidu.com/map/jsdemo.htm
类参考：http://developer.baidu.com/map/reference/index.php
整理内容：
一、获取AK，引入JS文件
二、基本使用
1、创建地图、添加控件、设置中心点与缩放比例
2、坐标点
3、不同标准的坐标点转换
4、获取两点间距离
5、操作标注(类似DOM的操作)
6、添加事件：使用addEventListener绑定
三、坐标与路名的转换：Geocoder
四、关键字查询：LocalSearch
五、消息窗口
1、普通消息窗口
2、带检索功能的消息窗口
六、路线规划：步行、驾车、公交
七、云lbs数据：LocalSearch可以搜索自定义的数据
八、其它
一、获取AK，引入JS文件
1、注册账号，登陆百度地图API控制台 http://lbsyun.baidu.com/apiconsole/key
2、创建应用(类别：服务端)，获取AK。IP范围按实际情况设置。
嫌麻烦就直接 0.0.0.0/0
3、引入JS文件：
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=DPB1POmiymAvKDwedtzkXajuGvwqZnwy"></script>
二、基本使用：
1、创建地图、添加控件、设置中心点与缩放比例
<div id='map'></div>
<script>
//传入div的id值
var map = new BMap.Map("map");
//添加 地图类型(地图、卫星、三维) 控件
map.addControl(new BMap.MapTypeControl());
//添加 缩放地图的 + - 控件
map.addControl(new BMap.NavigationControl({type: BMAP_NAVIGATION_CONTROL_ZOOM}));
//设置中心点与缩放比例
map.centerAndZoom(point, zoom); //zoom范围1-19，其中19的比例尺最小
</script>
2、坐标点：
坐标点是地图中最为常用的一个东西，几乎所有的内容都需要依靠坐标点来指定。
注意：此处的经纬度需要是百度标准的。
var lng = 120; //经度
var lat = 30; //纬度
var point = new BMap.Point(lng, lat);
3、不同标准的坐标点转换：
如果获取到的坐标不是百度标准，需要进行转换，否则会导致位置的偏移。
(比如获取到 GPS坐标：wgs84标准 火星坐标：gcj02标准)
//获取到 wgs84标准的坐标点
var lng_wgs84 = 120;
var lat_wgs84 = 30;
var point_wgs84 = new BMap.Point(lng_wgs84, lat_wgs84);
var convertor = new BMap.Convertor();
//第二个参数是原标准，第三个参数是新标准
//1--wgs84 5--bd09ll
convertor.translate(new Array(point_wgs84), 1, 5, function (data) {
if (data.status === 0) {
data.points[0]; // data.points[n] 转换成功后的坐标点
}
});
4、获取两点间距离：
var distance = map.getDistance(point1, point2);
5、操作标注(类似DOM的操作)：
//生成坐标点
var point = new BMap.Point(lng, lat);
//根据坐标点 创建标注
var marker = new BMap.Marker(point); //默认样式
var marker = new BMap.Marker({icon:new BMap.Icon("url", new BMap.Size(10, 10))}); //自定义图标
//给标注增加文本框（类似DOM的文本节点）
var Label = new BMap.Label("title", {offset: new BMap.Size(0, -20)}); //文本框
marker.setLabel(Label);
//设置标注是否可以 拖拽
marker.enableDragging(); //可拖拽
marker.disableDragging(); //不可拖拽
//添加到地图上(类似DOM 将新节点加入到页面中)
map.addOverlay(marker);
//删除标注：
map.removeOverlay(marker); //删除具体标注
map.clearOverlays(); //删除所有覆盖物(除了删除标注，还会删除其它内容)
6、添加事件：使用addEventListener绑定
//地图 点击事件
map.addEventListener("click", function(e){});
//标注 点击事件
marker.addEventListener("click", function(e){
//event.stopPropagation(); //可以防止事件冒泡
});
//标注 拖拽(结束)事件：
marker.addEventListener("dragend", function (type, target, pixel, point) {
//type.point 拖拽后的点
});
三、坐标与路名的转换：Geocoder
//创建 Geocoder对象
var geocoder = new BMap.Geocoder();
// 坐标-->路名：
geocoder.getLocation(point, function (geocoder_result) {
geocoder_result.address;
}
// 路名-->坐标：
geocoder.getPoint(address, function (point) {
if(point){ //注意：可能解析失败
//具体操作
}
}, "上海市");
四、关键字查询：LocalSearch
var local = new BMap.LocalSearch(map, {
onSearchComplete: function(results){
console.log(local.getStatus()); //返回查询是否成功 BMAP_STATUS_SUCCESS == 0
console.log(results.getNumPois()); //返回结果总数
console.log(results.getCurrentNumPois()); //返回当前页结果总数 默认10
console.log(results.getPoi(0)); //返回具体第几条数据
console.log(results.getPoi(1));
if (local.getStatus() == BMAP_STATUS_SUCCESS){
//查询成功，具体操作
for (i = 0; i < results.getCurrentNumPois(); i++) {
results.getPoi(i).point;
results.getPoi(i).title;
}
}
}
});
local.setPageCapacity(100); //设置 一次返回最大数量 最大为100
local.searchNearby('key_word', point, 1000); //设置范围 point的1000米内
local.searchNearby('key_word', point); //第三个参数为空，则为最近的
五、消息窗口：
1、普通消息窗口：
//其中content完全可以写入 html内容 比如 button等
var infoWindow = new BMap.InfoWindow("content", {width: 200, height: 200});
map.openInfoWindow(infoWindow, point); //在point位置显示出来
2、带检索功能的消息窗口(功能多点)：需要多引入文件
<script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
var searchInfoWindow = new BMapLib.SearchInfoWindow(map, 'content', {
title : "title",
width : 200,
height : 20,
panel : "panel", //检索结果面板 div 的 id
enableAutoPan : true, //自动平移
searchTypes : [ //设置功能内容
BMAPLIB_TAB_SEARCH, //周边检索
BMAPLIB_TAB_TO_HERE, //到这里去
BMAPLIB_TAB_FROM_HERE //从这里出发
]
});
searchInfoWindow.open(marker/point); //传入显示的位置：marker或point
六、路线规划：步行、驾车、公交
//在下一次的查询前，手动清除上一次的路线(覆盖物)
map.clearOverlays(); //或者自定义清除方式
//步行路线
var walking_route = new BMap.WalkingRoute(map, {
renderOptions: {
map: map,
panel: "map_route", //路线 文字版显示位置：div的id值
autoViewport: true
}
});
walking_route.search(point_departure, point_destination); //起点, 终点
//驾车路线
//BMAP_DRIVING_POLICY_LEAST_TIME 0 最少时间
//BMAP_DRIVING_POLICY_LEAST_DISTANCE 1 最短距离
//BMAP_DRIVING_POLICY_AVOID_HIGHWAYS 2 避开高速
var driving = new BMap.DrivingRoute(map, {
renderOptions: {
map: map,
panel: "map_route", //路线 文字版显示位置：div的id值
autoViewport: true
}, policy: 0 //规则
});
driving.search(point_departure, point_destination); //起点, 终点
//公交路线
//BMAP_TRANSIT_POLICY_LEAST_TIME 0 最少时间
//BMAP_TRANSIT_POLICY_LEAST_TRANSFER 2 最少换乘
//BMAP_TRANSIT_POLICY_LEAST_WALKING 3 最少步行
//BMAP_TRANSIT_POLICY_AVOID_SUBWAYS 4 不乘地铁
var transit = new BMap.TransitRoute(map, {
renderOptions: {
map: map,
panel: "map_route" //路线 文字版显示位置：div的id值
}, policy: 0 //规则
});
transit.search(point_departure, point_destination); //起点, 终点
//可以单独设置规则：比如在下拉框中进行选择：
driving.setPolicy(n);
transit.setPolicy(n);
七、云lbs数据：LocalSearch可以搜索自定义的数据
1、添加数据：
API控制面板--数据管理平台：http://lbsyun.baidu.com/data/mydata
创建表，编辑具体需要的坐标点信息
2、需要选择：是否将数据发布至云检索
3、根据表ID进行搜索
localsearch.searchNearby('keyword', point, 999, {customData: {geotableId: 123456}});
八、其它：
1、因为用在微信端，微信JS来定位，所以上面没有涉及百度地图的定位。
2、去除百度地图的logo图标：隐藏图标的div
.anchorBL {
display: none;
}
3、使用Geocoder类进行坐标与路名的转换，只能取得具体的路名(xx路xx号)，而没有地点名(xx大楼)。
如果需要后者，得用LocalSearch。
4、标注的跳动动画，在移动端尝试无效果。
