#鸿蒙通关秘籍#如何在地图组件中添加自定义标点图标？

实现自定义标点图标有两种方式，由于icon属性支持base64或PixelMap类型：

1. 将本地图标资源存放在resources/rawfile或resources/base/media中，使用如下代码来创建标记：

   let markerOptions: mapCommon.MarkerOptions = {
       position: {
           latitude: 24.4846,
           longitude: 118.1304
       },
       icon: $r('app.media.remark')
   }
   this.marker = await this.mapController.addMarker(markerOptions);
   1.
   2.
   3.
   4.
   5.
   6.
   7.
   8.

   复制

2. 加载网络图片并将其转换为PixelMap，请参考以下代码：

   this.markerIcon = await this.imageToPixelMap('在线图片链接', { desiredSize: { height: 120, width: 120 } });
   let markerOptions: mapCommon.MarkerOptions = {
       position: {
           latitude: 24.4846,
           longitude: 118.1304
       },
       icon: this.markerIcon ?? ''
   }
   this.marker = await this.mapController.addMarker(markerOptions);
   1.
   2.
   3.
   4.
   5.
   6.
   7.
   8.
   9.

   复制