鸿蒙 开发中:调用地图应用
本文介绍了如何通过调用petalMaps命名空间实现地图应用功能集成。主要内容包括:1) 各版本支持的功能(如5.0.3版本支持导航、6.0.1新增打车功能等);2) 核心接口说明,涵盖地图首页、搜索、详情查看、路线规划、导航、打车和离线地图管理等功能;3) 开发步骤,包括模块导入和不同功能的参数配置;4) 重要注意事项,如不同地区使用不同坐标系(中国大陆GCJ02,台湾/海外WGS84),所有接
·

开发中,除了使用Map Kit自带的地图组件外,还可以通过调用地图应用来实现各种能力。通过petalMaps命名空间,可以拉起地图应用完成首页、搜索、详情、路线规划、导航、打车、离线地图管理等功能。
一、版本说明
| 版本 | 新增功能 |
|---|---|
| 5.0.3(15) | 地图应用首页、搜索地点、查看地点详情、规划路线、导航 |
| 6.0.1(21) | 发起打车功能 |
| 6.1.1(24) | 查看地点详情支持终点描述、拉起离线地图管理页面 |
坐标类型
| 站点 | 使用坐标系 |
|---|---|
| 国内站点(中国大陆) | GCJ02坐标系 |
| 国内站点(中国台湾) | WGS84坐标系 |
| 海外站点 | WGS84坐标系 |
二、核心接口
| 接口 | 描述 |
|---|---|
openMapHomePage(context) |
打开地图应用首页 |
openMapTextSearch(context, params) |
打开地图应用搜索地点 |
openMapPoiDetail(context, params) |
打开地图应用查看地点详情 |
openMapRoutePlan(context, params) |
打开地图应用规划路线 |
openMapNavi(context, params) |
打开地图应用进行导航 |
openMapTaxi(context, params) |
打开地图应用打车页面 |
openMapOfflineDataManagement(context, params) |
打开地图应用离线地图管理页面 |
三、开发步骤
3.1 导入模块
import { petalMaps } from '@kit.MapKit'
import { common } from '@kit.AbilityKit';
四、打开地图应用首页
try {
await petalMaps.openMapHomePage(this.getUIContext().getHostContext());
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
五、打开地图应用进行地点搜索
通过openMapTextSearch,传入搜索目标名称,打开地图应用进行地点搜索。
try {
let params: petalMaps.TextSearchParams = {
destinationName: '云谷'
};
await petalMaps.openMapTextSearch(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
TextSearchParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
destinationName |
string | 搜索目标名称 |
六、打开地图应用查看地点详情
通过openMapPoiDetail,传入地点的经纬度,打开地图应用查看地点详情。
try {
let params: petalMaps.PoiDetailParams = {
destinationPosition: {
latitude: 31.968789,
longitude: 118.798537
},
destinationName: '标记点',
zoom: 17,
coordinateType: mapCommon.CoordinateType.GCJ02,
destinationAddress: '这是我选择的演示名称'
};
await petalMaps.openMapPoiDetail(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
PoiDetailParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
destinationPosition |
LatLng | 地点经纬度 |
destinationName |
string | 地点名称 |
zoom |
number | 缩放级别 |
coordinateType |
CoordinateType | 坐标类型(GCJ02/WGS84) |
destinationAddress |
string | 终点描述(6.1.1+) |
七、打开地图应用规划路线
通过openMapRoutePlan,传入终点经纬度,打开地图应用规划路线。
try {
let params: petalMaps.RoutePlanParams = {
destinationPosition: {
latitude: 31.983015468224288,
longitude: 118.78058590757131
}
};
await petalMaps.openMapRoutePlan(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
RoutePlanParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
destinationPosition |
LatLng | 终点经纬度 |
八、打开地图应用进行导航
通过openMapNavi,传入终点经纬度,打开地图应用发起导航。
try {
let params: petalMaps.NaviParams = {
destinationPosition: {
latitude: 31.983015468224288,
longitude: 118.78058590757131
}
};
await petalMaps.openMapNavi(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
NaviParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
destinationPosition |
LatLng | 终点经纬度 |
九、打开地图应用打车页面(6.0.1+)
通过openMapTaxi,传入终点经纬度,打开地图应用发起打车。
try {
let params: petalMaps.TaxiParams = {
destinationPosition: {
latitude: 31.983015468224288,
longitude: 118.78058590757131
}
};
await petalMaps.openMapTaxi(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
TaxiParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
destinationPosition |
LatLng | 终点经纬度 |
十、打开地图应用离线地图管理页面(6.1.1+)
通过openMapOfflineDataManagement,传入离线地图管理参数,打开地图应用离线地图管理页面。
10.1 打开手表离线地图管理页面
try {
let params: petalMaps.OfflineDataParams = {
scenarios: 'WATCH',
recommendedRegionIds: ['1026355368865976081']
};
await petalMaps.openMapOfflineDataManagement(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
10.2 打开手机离线地图资源管理页面
try {
let params: petalMaps.OfflineDataParams = {
scenarios: 'PHONE',
recommendedRegionIds: ['1026355368865976081']
};
await petalMaps.openMapOfflineDataManagement(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
10.3 打开导航语音管理页面
try {
let params: petalMaps.OfflineDataParams = {
scenarios: 'VOICE'
};
await petalMaps.openMapOfflineDataManagement(this.getUIContext().getHostContext(), params);
} catch (e) {
console.error(`code:${e.code}, message:${e.message}`);
}
OfflineDataParams参数:
| 参数 | 类型 | 说明 |
|---|---|---|
scenarios |
string | 场景类型:WATCH/PHONE/VOICE |
recommendedRegionIds |
string[] | 推荐下载离线地图的地区集合(可选) |
注意事项
| 注意点 | 说明 |
|---|---|
| 坐标系 | 中国大陆使用GCJ02,中国台湾和海外使用WGS84 |
| Context | 所有接口都需要传入UIAbilityContext |
| 终点描述 | 查看地点详情的destinationAddress参数从6.1.1(24)开始支持 |
更多推荐



所有评论(0)