参考链接：官方文档

华为地图必须调试证书才能显示

那么我们需要生成什么证书呢，如下

生成签名证书指纹

需要进行一系列的配置操作

• p12文件
• csr文件
• cer文件-调试证书
• p7b文件-调试证书

AGC开启地图服务

配置应用包和证书

配置项目的module.json5中的应用指纹

注意：目前只能采用调试证书查看地图，发布证书目前模拟器无法渲染地图

生成签名的话，首先我们需要

再这里生成密钥和证书

注意文件名后面要加.p12

密码

然后第二个方框里面要选密码，这个密码一定不要忘记，为了防止忘记，我们一般都用Aa123456来作为密码

第三个方框为确认密码的方框

确认之后需要我们再写一个别名

为了防止忘记，我们就用xue_xi_xiang_mu来进行记忆，防止忘记

为了方便记忆，我们就写hongmengxiangmu

然后就可以下一步了

点击下一步就到这个页面了

然后它需要填写一个csr文件的存放，我们还需要再选择一下

这个时候，我们文件下面就会多出来这两个证书了

接下来就是需要我们的发布证书了

发布证书

首先我们要先去这个地方来找我们的发布签名

再这里可以新建我们的证书

然后选择的这个文件其实就是我们上一步新建的csr文件

然后就可以提交了

提交完成之后，我们需要把它下载下来

下载会下载一个cer文件

然后我们把它也拷贝到证书存放的那个文件备用

申请之后，接下来还需要我们申请Profile

我们首先需要再这个地方添加项目

然后去添加我们的应用

它里面需要一个包名，这个包名其实就是

这个

选择地图然后点击保存，然后确认

保存完成之后找到profile

然后填写信息点击添加

然后会弹出提交成功

添加成功之后，我们还把它进行下载

下载后把这个证书也放到那个文件夹里面去

这样我们的这4个文件就集齐了

然后点这个发布，这个其实是有一个发布的只不过我已经点了

权限

接下来我们需要再这个地方

点进去往下面滑

然后把位置权限和地图权限给勾上

配置证书

弄好之后，接下来就需要配置我们的文件了

那么再那个地方配置证书呢

当然是再这个地方

然后点击ok即可

点击ok之后，我们把项目进行一个运行，如果运行成功的话，那么就是配置成功了

调试证书

注意如果我们是再模拟器上面使用的话，只能使用调试证书

所以我们把刚刚那个证书换成调试证书

然后来到我的项目

找到这里

点击这里

再这里进入Profile再这里再新建一个Profile文件

因为之前那个弄的是发布证书的，我们这里把他删了，用不上

然后把设备里面的所有设备都选择上

弄好之后，我们需要再下载一下，再配置一下

第二步

配置好文件之后，接下来需要开始我们的第二步骤

第二部首先需要我们回到我的项目这个地方

拿到我们的这个 Client ID

我们这个Client ID的值为 6917578074100888129

然后回到我们的项目区域

找到如下文件

然后再我们的abilities的下方，配置一个metadata的属性

    "metadata": [{
      "name": "client_id",
      "value": "6917578074100888129"
    }],

然后我们需要再里面写一些内容

一个是name，和一个value这两个值
name就是我们的Client ID因为空格容易报错因此我们换成下划线Client_ID

值就是上面保存的6917578074100888129

弄好之后，接下来来到如下地方，添加一个公钥指纹

然后把下面这个勾选上

添加好如下

地图的展示

这些弄好之后，我们接下来就需要弄那个地图的展示了

第一步，首先我们需要先导入模块

import { MapComponent, mapCommon, map } from '@kit.MapKit';
import { AsyncCallback } from '@kit.BasicServicesKit';

然后使用

MapComponent()来创建一个地图

它里面需要传入一些内容，首先它里面需要传入一个mapOptions它的值为一个对象，这个对象里面还需要传入一个position它里面还需要传入一个target...

我们下面有一个传好的示例，如下

      MapComponent({
        mapOptions: {
          //位置
          position: {
            target: {
              //当前的经纬坐标
              latitude: 39.9,//经度，（这个是北京的正中心）
              longitude: 116.4//纬度（这个是北京的正中心）
            },
            zoom: 10//缩放级别
          }
        },
        mapCallback: () => {}
      }).width('100%').height('100%')