一、了解百度地图API

1、百度地图JavaScript API简介

百度地图JavaScript API是一套由JavaScript语言编写的应用程序接口，可在网站中构建功能丰富、交互性强的地图应用，支持PC端和移动端基于浏览器的地图应用开发，且支持HTML5特性的地图开发。该套API免费对外开放。自v1.5版本起，需先申请密钥（ak）才可使用，接口（除发送短信功能外）无使用次数限制。

在使用百度地图JavaScript API之前，请先阅读百度地图API使用条款。任何非营利性应用请直接使用，商业应用请参考使用须知。

JavaScript API首家支持Https，已全面开放，无需申请可直接使用。同时建议您认证企业信息，Web API类产品可获取更高配额。

注意：仅JavaScript API V2.0及以上版本支持https，其他JavaScript API版本均不支持。使用https服务，请先检查您的版本以及配置注意事项。

图1 JavaScript API 使用指南

2、获取密钥

登陆百度账号，按照获取密钥的指示获取您的AK，这就是将来在线开发过程中需要用到的AK信息。

图2 申请密钥

http://api.map.baidu.com/api?v=1.4    //参数v表示您加载API的版本，使用JavaScript APIv1.4及以前版本可使用此方式引用。

http://api.map.baidu.com/api?v=2.0&ak=您的密钥   //使用JavaScript API v2.0请先申请密钥ak，按此方式引用。

3、开发指南

开发指南中介绍了构建地图基本功能的各种模块，包括控件、覆盖物、事件、地图图层、工具、服务、用户数据图层、全景图展现、定制个性地图。

4、类参考

类参考是在具体实现地图的各项功能时所用的类库。包括核心类、基础类、控件类、覆盖物类、右键菜单类、地图类型类、地图图层类、服务类、全景类。每个类都有介绍相应的属性、类型、描述。

5、示例Demo

Demo是在实现所需功能时可以直接用来参考和修改的代码，每个Demo实现一个基础的功能，在具体应用中往往需要参考多个Demo添加多项功能。

6、开源库和相关下载

百度地图JavaScript开源库是一套基于百度地图API二次开发的开源的代码库。目前提供多个lib库，帮助开发者快速实现在地图上添加Marker、自定义信息窗口、标注相关开发、快速加载城市列表、拉框放大、拉框搜索、区域限制设置、几何运算、实时交通、检索与公交驾车查询、鼠标绘制工具等功能。百度地图JavaScript开源库秉着学习交流的态度，全部开源，可以参考开发文档，直接调用现有的开源库，也可以下载每个类的源文件，自行修改再使用。

开源库包括大数据可视化库、热力图、城市商圈及行政区域、绘制弧线类、鼠标绘制工具条库、检索信息窗口类、地图包裹类、事件包装类、自定义信息窗口、标注管理器、富标注、路书、测距工具、聚合marker、添加标注工具、自定义覆盖物、拉框放大工具、拉框搜索、区域限制、几何运算、交通流量、检索控件等。相关下载包括JavaScript API v2.0/v1.4 类参考文档和开发指南文档。

二、用百度地图API在线版实现相应功能

1、用本地编辑器Sublime Text 2，参考Demo编写网页。

2、<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>。是否需要添加自己的AK信息，这是v2.0和v.1.4的区别，也是在线版和离线版的区别。

3、<script type="text/javascript" src="data.js"></script>标注点的信息从.js文档中读取，也可通过其他途径如数据库和服务器中读取。

图3 从data.js中读取多个终端的信息并添加信息窗口（在线）

三、用百度地图API离线版实现相应功能

项目中要求web版百度地图要离线开发，此过程主要有三个技术点：如何获取离线API；如何获取离线瓦片图；如何在离线状态下将WGS坐标转换为百度地图坐标。这里请参考http://www.cnblogs.com/Joanna-Yan/p/5822231.html（最全面的百度地图JavaScript离线版开发）。

1、如何获取离线API

http://api.map.baidu.com/api?v=2.0&ak=“您的密钥”下载API主文件，修改API主文件：加载模块短路处理、加载瓦片改为离线瓦片、去掉AK验证、下载模块代码。API主文件代码修改步骤请参考于忠达《百度地图2.0离线版的制作》（https://my.oschina.net/smzd/blog/548538）。

注意：所有的离线文件要放在同一个文件夹下。

2、如何获取离线瓦片图

网上有各种地图下载器包括：太乐电子地图下载器、水经注电子地图下载器、全能电子地图下载器。可下载全国19级地图。

3、坐标转换

国际经纬度坐标标准为WGS-84,国内必须至少使用国测局制定的GCJ-02,对地理位置进行首次加密。百度坐标在此基础上，进行了BD-09二次加密措施,更加保护了个人隐私。百度对外接口的坐标系并不是GPS采集的真实经纬度，需要通过坐标转换接口进行转换。坐标转换、批量坐标转换示例详见JavaScript API示例【地图示例_坐标换算】。

4、最终解决办法

按照上述步骤完成的百度地图API离线版有部分功能无法实现，模块添加需要通过修改加载模块的语句来完成，我难以找全全部的模块，导致有些遗留问题，博客作者本身也遇到过类似的问题，我按照他的方法仍无法解决。

在网上继续搜集信息，找到了一个完整的离线版开发包，请访问“小郭软件-原创与分享简单易用的绿色软件”（http://www.xiaoguo123.com/），作者把所有的模块下载在一个文件夹里，也仿照在线版Demo写了一个完整的Demo,基本无需更改即可使用。这个开发包里，获取离线API、离线瓦片、坐标转换等功能均已完成。全部19级瓦片的下载需要自己用下载器实现。

图4 从data.js中读取多个终端的信息并添加信息窗口（离线）

四、在线和离线的效果对比

明显地，在线版在外观界面上优于离线版，部分功能如中心城市设为“北京”，在离线版无法实现，初始显示只能以某个坐标为中心。尽管如此，离线版已经能满足项目的需求。各项功能只需在Demo的基础上逐步添加即可。

图5  在线版Demo

图6离线版Demo