目录

地点详情展示

场景介绍

本章节介绍如何集成地点详情展示控件。该控件提供便捷的地点详情展示功能以及导航和打车服务入口，开发者无需自行开发地图页面，即可实现用户点击“路线”按钮启动导航，或点击“打车”按钮发起打车。

图1 地点详情

约束与限制

使用该功能需满足以下条件：

接口说明

地点详情控件功能主要由sceneMap命名空间下的queryLocation方法提供，更多接口及使用方法请参见接口文档。

接口名 描述
LocationQueryOptions 查询地点详情的参数。
queryLocation(context: common.UIAbilityContext, options: LocationQueryOptions): Promise<void> 查询地点详情。

开发步骤

  1. 导入相关模块。

    import { sceneMap } from '@kit.MapKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { common } from '@kit.AbilityKit';

  2. 创建查询地点详情参数，调用queryLocation方法拉起地点详情页。

    // 方式一：传入siteId
let queryLocationOptions: sceneMap.LocationQueryOptions = {
  siteId: "922207154068557824"
};
// 拉起地点详情页
sceneMap.queryLocation(this.getUIContext().getHostContext() as common.UIAbilityContext, queryLocationOptions)
  .then(() => {
    console.info("QueryLocation", "Succeeded in querying location.");
  })
  .catch((err: BusinessError) => {
    console.error("QueryLocation", `Failed to query Location, code: ${err.code}, message: ${err.message}`);
  });

// 方式二：传入location和name
let queryLocationOptions: sceneMap.LocationQueryOptions = {
  location: {
    latitude: 39.9175,
    longitude: 116.3972
  },
  name: '故宫博物院'
};
// 拉起地点详情页
sceneMap.queryLocation(this.getUIContext().getHostContext() as common.UIAbilityContext, queryLocationOptions)
  .then(() => {
    console.info("QueryLocation", "Succeeded in querying location.");
  })
  .catch((err: BusinessError) => {
    console.error("QueryLocation", `Failed to query Location, code: ${err.code}, message: ${err.message}`);
  });