全部服务产品
开发者频道
定价
登录
显示地图
下载开发文档

百度地图HarmonyOS NEXT版地图SDK为开发者提供了便捷的地图渲染SDK。

创建地图

只需要按照如下操作,即可快速进行百度地图展示:

效果示例效果示例
1. 第一步 在绘制地图前初始化SDK,如下:
Initializer.getInstance().initialize("Your API_KEY");
2. 第二步 创建MapComponent
// 设置地图控件参数
mapOpt: MapOptions = new MapOptions({
// 配置地图状态,如地图缩放等级、显示中心点、旋转角等
mapStatus: new MapStatus(),
// 默认基础地图,可通过改变satelliteMap的值加载不同的底图
shows:{satelliteMap:SysEnum.ESatelliteLayerType.NONE}
});
// 地图初始化的回调
this.callback = async (err, mapController:MapController) => {
if (!err) {
// 获取地图的控制器类,用来操作地图
this.mapController= mapController;
}
};
MapComponent({ onReady: this.callback, mapOptions: this.mapOpt }).width('100%').height('100%')
改变底图

可通过下面两种形式改变地图底图:
一种是通过地图初始化设置MapOptions时设置satelliteMap的参数来配置不同底图;
一种是通过给MapOptions.showSatelliteMap赋值形式改变,示例代码如下。

// 基础地图
this.mapController.mapOptions.showSatelliteMap = SysEnum.ESatelliteLayerType.NONE;
// 无路网的卫星图
this.mapController.mapOptions.showSatelliteMap = SysEnum.ESatelliteLayerType.NO_ROUTE;
// 有路网的卫星图
this.mapController.mapOptions.showSatelliteMap = SysEnum.ESatelliteLayerType.ROUTE;
交通流控制

可通过下面两种形式改变地图交通流显示状态:
一种是通过地图初始化设置MapOptions时设置trafficMap的参数来配置是否显示交通流;
一种是通过给MapOptions.showTrafficMap赋值形式改变。
示例代码如下:

// 初始化配置形式
mapOpt: MapOptions = new MapOptions(shows:{trafficMap:true}});
// 显示交通流
this.mapController.mapOptions.showTrafficMap = true;
// 不显示交通流
this.mapController.mapOptions.showTrafficMap = false;

上一篇

工程配置

下一篇

个性化地图

本篇文章对您是否有帮助?