1.首先进入百度地图开放平台
2.找到 开发 选项，选择合适的平台，我选的Web开发——JavaScript API
3.根据说明，需要先申请秘钥才可以使用
开发流程：
1.首先获取服务，获取秘钥后，在HTML中引入，如下：
将秘钥yourAppKey替换成你自己的即可
2.定义一个容器，地图会在定义的容器中显示，这个容器要有确定的宽高,如果是移动端还需要加上meta标签
3.命名空间
API 使用 BMap 作为命名空间，所有类都在命名空间之下，也就是说无论是创建地图，还是创建一个覆盖物或者控件，都需要使用 BMap.[类]，下边是一个简易的地图实例(在上边代码的标签中实现)
常用API介绍
1.Map 地图类
Map 是地图 API 的核心类，用来实例化一个地图
通过new BMap.Map(container);来创建，之后需要调用centerAndZoom(point,zoom)方法对地图进行初始化，否则进行不了任何操作
map.getCenter()、map.setCenter(center:Point|String)
获取当前中心点坐标 map.getCenter()得到的是一个 point 对象、设置当前中心点坐标
map.getDistance(start:Point,end:point)
返回两点间距离，需要两个点的point
map.getZoom() 、 map.setZoom(zoom)
返回当前地图的缩放比 、设定地图的缩放比
map.centerAndZoom(point,zoom)
用于初始化地图，设置初始化时的中心点及缩放级别
map.panTo(point)
修改地图的中心点，并且移动过去
reset()
重置地图，恢复地图初始化时的中心点和级别
addControl(control:Control)、removeControl(control:Control)
向地图中添加控件、从地图中移除控件
getContainer()
获取地图的容器元素
addOverlay(overlay:Overlay)、removeOverlay(overlay:Overlay)
向地图中添加覆盖物、从地图中移除覆盖物
clearOverlays()
清除地图上所有覆盖物
getOverlays()
获取地图上所有的覆盖物
2.Point 坐标点类
表示地图上的一个坐标点var point = new BMap.Point(lng,lat) lng:经度 lat:纬度
defaultOffset
控件默认位置的偏移值
this.defaultOffset =newBMap.Size(rem *0.16, rem *0.2);
5.Overlay 覆盖物类
show()、hide()、isVisible()
显示覆盖物、隐藏覆盖物、判断覆盖物是否可见
百度地图提供的覆盖物比较好用，很少情况会自定义覆盖物
6.Marker 图像标注
通过：new BMap.Marker(point, opts);创建，Marker 是我使用比较多的 API，它的配置和使用方法都比较多，如果在这里找不到想要的功能可以到官方文档上找找
setIcon(icon:Icon)、getIcon()
设置标注所用的图标对象、返回标注所有的标注对象
setPosition(position:Point)、getPosition()
设置标注的地理坐标、返回标注的地理坐标
setOffset(offset:Size)、getOffset()
设置标注的偏移值、返回标注的偏移值
setLabel(label:Label)、getLabel()
为标注添加文 标注、返回标注的文本标注
setTitle(title:String)、getTitle()
设置标注的标题,当鼠标移至标注上时显示此标题、返回标注的标题
enableDragging()、disableDragging()
开启标注拖拽功能、关闭标注拖拽功能
enableMassClear()、disableMassClear()
允许覆盖物在 map.clearOverlays方法中被清除、禁止覆盖物在 map.clearOverlays 方法中被清除
openInfoWindow(infoWnd:InfoWindow)、closeInfoWindow()
打开信息窗、关闭信息窗
7.Icon 图标
多用于给覆盖物，定义的显示图标Icon(url:String, size:Size[opts:IconOptions])
9.DrivingRoute 驾车路线规划方案
由于需要用到路线规划，所以使用了这个类，通过DrivingRoute(location:Map|Point|String[, opts:DrivingRouteOptions])可以创造一个驾车导航实例
search(start:String|Point, end:String|Point[,options:object])
发起检索功能，需要两个参数:起始位置、结束位置
getResults()
返回最近一次检索结果
clearResults()
清除最近一次检索结果
enableAutoViewport()、disableAutoViewport()
搜索结构显示时，自动调整地图层级、禁用自动调整
setPolylinesSetCallback(callback:Function)
10.Geolocation 获取本地位置信息
创造实例后，通过getCurrentPosition方法获得，如下：
React 中使用百度地图
由于应用使用 react 构建，所以还需要将两者结合，摸索了一下，最终得到一下解决方案
在 render 中定义地图的容器，设定好宽高
在 componentDidMount 中初始化地图，并且把地图挂在到组件上this.map = new BMap.Map("container"); var map = this.map;
如果其他生命周期需要操作map(一般是componentDidUpdate)，直接使用this.map