一、了解百度地图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