vue3制作地图，可接口，图标可调

AMapLoader.load({
  key: "346e4aa4dc6444f5a7f69bf1ff66ca1a", // 申请好的Web端开发者Key，首次调用 load 时必填
  version: "1.4.15", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
  plugins: [], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
  AMapUI: {
    // 是否加载 AMapUI，缺省不加载
    version: "1.1", // AMapUI 缺省 1.1
    plugins: [], // 需要加载的 AMapUI ui插件
  },
  Loca: {
    // 是否加载 Loca， 缺省不加载
    version: "1.3.2", // Loca 版本，缺省 1.3.2
  },
}).then((AMap) => {
  fnsss();
  var map = new AMap.Map("container", {
    resizeEnable: true,
    // center: [res.data.data[i].lng, res.data.data[i].lat],
    center: [scenic.value[0].lng, scenic.value[0].lat], //中心点坐标
    zoom: 12,
  });
  let datado = [];
  for (let i = 0; i < scenic.value.length; i++) {
    var marker = new AMap.Marker({
      position: new AMap.LngLat(
        Number(scenic.value[i].lng),
        Number(scenic.value[i].lat)
      ), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
      // center: [lng_lst.value[i].lng, lng_lst.value[i].lat],                 //中心点坐标
      // icon: identification.value[types.value],
      // anchor: "bottom-center",
      // offset: new AMap.Pixel(100, 100),
      // imageSize: new AMap.Size(100, 100), // 根据所设置的大小拉伸或压缩图片
      icon: new AMap.Icon({
        image: identification.value[types.value],
        size: new AMap.Size(52, 52), //图标大小
        imageSize: new AMap.Size(56, 56),
      }),
    });
    map.add(datado);
    // 设置label标签
    // label默认蓝框白底左上角显示，样式className为：amap-marker-label
    marker.setLabel({
      direction: "right",
      offset: new AMap.Pixel(-65, -45), //设置文本标注偏移量
      content:
        `<div style="width:80px;height:30px;">
            <p style="display: flex;align-items: center;height:15px;width:100%;justify-content: center;font-weight: bold;">` +
        scenic.value[i].name +
        `</p>
            <p style="display: flex;align-items: center;height:15px;width:100%;justify-content: center;"><span>在线人数</span><span>` +
        scenic.value[i].num +
        `</span></p>
        </div>`, //设置文本标注内容
      // <p style="width:100%;display: flex;justify-content: center;"><b>`+ res.data.tab[i].create_time + `</b></p>
    });
    //   lngg.push(marker);
    datado.push(marker);
    //   map.add(lngg);
    map.add(datado);
  }
});