APICloud开发者进阶之路 |百度地图模块的接入和使用
今天又周五啦，不知道小伙伴们的心情又没有很好?上期APICloud与大家分享了《30天，App开发从0到1》一书本地存储和图片缓存的内容，本期我们继续分享第六章内容。
前面的章节已经对 APICloud 端引擎、API 对象和模块进行了介绍。在 APICloud 模块 Store中还有大量由第三方开放服务平台提供的模块，如推送、分享、地图等。本章将继续学习这些 内容并把它们使用到示例 app 中。
● 学习目标
(1)了解什么是第三方服务和有哪些常用的第三方服务。
(2)了解和编译自定义 AppLoader。
(3)学习使用百度地图、微信分享和登录、个推推送和支付宝支付模块。
本期APICloud与大家分享的是第六章第五节：
百度地图模块的接入和使用
一些 app 会涉及地理定位和地图相关功能。
APICloud 提供了很多第三方地图模块，例如高 德地图和百度地图等，本节以百度地图为例讲解百度地图模块的接入和使用方法。
1. 申请应用 ID 和 Key
百度地图是百度提供的一项网络地图搜索服务，覆盖了国内近 400 个城市、数千个区县。 在百度地图里，用户可以查询街道、商场、楼盘的地理位置，也可以找到离用户最近的餐馆、 学校、银行、公园等。
首先在 APICloud 云平台的项目控制台中添加“bMap”模块。点击左侧菜单中的模块按钮,再点击右侧的模块库标签，搜索“bMap”模块并点击加号进行添加。
接下来需要注册百度地图开放平台账号并开通相关服务。
打开百度地图开放平台页面，登录百度账号。点击控制台按钮，如果是第一次使用百度地图服务需要进行身份注册。点击页面中的创建应用按钮。
百度开放平台的安全码获取需要区分移动平台，这意味着如果同一个应用需要同时支持 iOS 和 Android 平台，那么必须为这两个平台分别申请 apiKey，即同一个应用申请两个 apiKey，并将这两个 apiKey 同时配置在 config 文件中。
点击“创建应用”，系统弹出创建 AK(APICloud 平台上称之为 apiKey)页面，输入应用名 称，将应用类型改为 iOS 或 Android。
以 Android 为例，需要填入 SHA1 码和包名，在 APICloud 云平台的 app 控制台中可以获取 这些信息。
将 SHA1 码和包名填入“发布版 SHA1”“开发版 SHA1”和“包名”即可。 在百度地图开放平台提交后会出现一条新的应用记录，其中“访问应用(AK)”就是申请到的 Key，iOS 的申请过程类似。
2. 配置 ID 和 Key
配置项目的“config.xml”文件，添加如下代码:
至此百度地图的引入就完成了，提交代码并生成自定义 AppLoader 即可开始调试。
3. 百度地图的常用 API
下面是“bMap”的常用 API :
// 初始化百度地图引擎
var map = api.require('bMap');
map.initMapSDK(function(ret) {
if (ret.status) {
alert(' 地图初始化成功，可以从百度地图服务器检索信息了!'); }
});
// 打开百度地图map.open({
rect: { x: 0,
y: 0,
w: 320, }, h: 300
center: {
lon: 116.4021310000,//打开地图时的中心经度},
lat: 39.9994480000//打开地图时的中心纬度
zoomLevel: 10,//设置百度地图缩放等级，取值范围:3~18级
showUserLocation: true,//是否在地图上显示用户位置
fixedOn: api.frameName,//模块视图添加到指定 frame 的名字(只指 frame，传 window 无效)
}, function(ret) { if (ret.status) {
alert(' 地图打开成功 ');}); }
// 根据经纬度设置百度地图中心点，此接口可带动画效果map.setCenter({
coords: {
lon: 116.404,//中心经度
}, lat: 39.915//中心纬度
}); animation: false//是否使用动画
// 获取百度地图中心点坐标map.getCenter(function(ret) {
//ret = {
// lon : 100, 中心经度// lat : 100 中心纬度
}); //}
//根据单个关键字搜索兴趣点，无需调用 open 接口即可搜索map.searchInCity({
city: '北京',//要搜索的城市
keyword: '学校',//要搜索的关键字
pageIndex: 0,//分页索引
pageCapacity: 20//每页包含的条数
}, function(ret, err) {
// ret = {
// status: true,
布尔型;true||false
// totalNum: 10,
数字类型;本次搜索的总结果数
// currentNum: 5,
数字类型;当前页的结果数
// totalPage: 10,
数字类型;本次搜索的总页数
// pageIndex: 1,
数字类型;当前页的索引
// results: [{
数组类型;返回搜索结果列表
lon: 116.213,
数字类型;当前内容的经度
lat: 39.213,
数字类型;当前内容的纬度
name: '',
字符串类型;名称
uid: 123
数字类型;兴趣点的id
address: '',
字符串类型;地址
city: '',
字符串类型;所在城市
phone: '',
字符串类型;电话号码
poiType: 0
数字类型;POI 类型
// 取值类型:
// 0(普通点)
// 1(公交站)
// 2(公交线路)
// 3(地铁站)
// 4(地铁线路)
// }]
//}
});
更多“bMap”模块的使用方法请参阅官方文档(Open-SDK 部分)。
