【HarmonyOS】鸿蒙应用实现调用系统地图导航或路径规划

【HarmonyOS】鸿蒙应用实现调用系统地图导航或路径规划

前言

在涉及地图业务中,调用地图导航和路径规划是三方应用中较为常见的功能。

若只是子业务需要地图导航效果,整个APP内部集成地图去实现导航或者路径规划,会造成SDK集成冗余。毕竟很重。

所以该效果一般会调用系统地图,来显示当前坐标和目标坐标的路径规划或者实时导航。

鸿蒙系统提供了一种极其简单的调用方式,默认是自己当前的坐标为基础,

需要注意的是,国内的坐标系是GCJ02坐标系,国外才是wgs84坐标系。

示例效果

地图导航: 路径规划:

DEMO示例

系统地图应用的包名为: 'com.huawei.hmos.maps.app'

dart 复制代码
import { common, Want } from '@kit.AbilityKit';

@Entry
@Component
struct Index {


  aboutToAppear(): void {

  }

  StartNavi = ()=>{
    let petalMapWant: Want = {
      bundleName: 'com.huawei.hmos.maps.app',
      uri: 'maps://routes', // 路径规划
      // uri: 'maps://navigation', // 导航
      parameters: {
      	// 接入方业务名或包名,Link请求来源。
        linkSource: 'com.example.navitest',
        destinationLatitude: 40.0382556,
        destinationLongitude: 116.3144536,
        // 终点Poi ID,如果有,优先使用(Map Kit返回的Poi信息含Poi ID)。
        destinationPoiId: '906277887815706098',
        destinationName: '北京清河高铁站',
        vehicleType: 0 // 交通出行工具。0-驾车, 1-步行, 2-骑行。默认驾车
      }
    }

    let context = getContext(this) as common.UIAbilityContext;
    context.startAbility(petalMapWant);
  }

  build() {
    RelativeContainer() {
      Text("唤起导航")
        .id('HelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })
        .onClick(this.StartNavi)
    }
    .height('100%')
    .width('100%')
  }
}

wgs84坐标系转化为gcj02:

dart 复制代码
import { map, mapCommon } from '@kit.MapKit';

let wgs84Position: mapCommon.LatLng = {
  latitude: 30,
  longitude: 118
};
let gcj02Position: mapCommon.LatLng =
  map.convertCoordinateSync(mapCommon.CoordinateType.WGS84, mapCommon.CoordinateType.GCJ02, wgs84Position);
相关推荐
不听话坏6 小时前
Ignition篇(下 一) 动态执行前的事情
开发语言·前端·javascript
likeyi076 小时前
require 和 import的区别
开发语言·前端
pany6 小时前
做 AI 友好的开源 Vue3 模板 🌈
前端·vue.js·ai编程
小二·7 小时前
React 19 + Next.js 15 现代前端开发实战:App Router / Server Components / 流式渲染
前端·javascript·react.js
全堆鸿蒙7 小时前
27 RdbPredicates 条件查询详解:EqualTo、OrderBy、组合条件
华为·harmonyos·鸿蒙系统
心中有国也有家8 小时前
AtomGit Flutter 鸿蒙客户端: ChangeNotifier 模式
学习·flutter·华为·harmonyos
谙忆10248 小时前
前端图片直传对象存储:OSS/S3 预签名 URL、STS 临时凭证与回调校验
前端
国服第二切图仔8 小时前
HarmonyOS APP《画伴梦工厂》开发第59篇-碰一碰精准分享——跨设备素材插入
华为·harmonyos
hqzing8 小时前
在鸿蒙 PC 上使用 Claude Code(最新的 Bun 版本)
华为·harmonyos
xd1855785559 小时前
鸿蒙AI菜谱生成器:基于ArkTS原生开发与鸿蒙PC适配实战
人工智能·华为·harmonyos·鸿蒙