vue+Arcgis js api+@arcgis/core

1.安装@arcgis/core

npm i  @arcgis/core -s

2.加载天地图作为底图，初始化地图项目

<template>
  <div class="app-container">
    <div id="mapdiv"></div>
  </div>
</template>
 
<script>
import "@arcgis/core/assets/esri/themes/light/main.css";
import Basemap from "@arcgis/core/Basemap";
import Map from "@arcgis/core/Map";
import MapView from "@arcgis/core/views/MapView";
import WMTSLayer from "@arcgis/core/layers/WMTSLayer";
import Point from "@arcgis/core/geometry/Point";
 
export default {
  name: "index",
  data() {
    return {};
  },
  mounted() {
    const tk = "天地图开发id"; // 你申请的key
    // 矢量底图
    const layer = new WMTSLayer({
      url: "/vec_c/wmts",
      customParameters: {
        tk: tk,
      },
    });
    //矢量注记
    const annaLayer = new WMTSLayer({
      url: "/cva_c/wmts",
      customParameters: {
        tk: tk,
      },
    });
 
    let mybasemap = new Basemap({
      baseLayers: [layer, annaLayer],
    });

    let map = new Map({
      basemap: mybasemap,
    });

    const view = new MapView({
      map,
      container: "mapdiv",
    });

    view.when((params) => {
      view.scale = 1000000;
      let pt = new Point({
        latitude: 23.186874,
        longitude: 113.284777
      });
      view.goTo(pt)
    })
  },
  methods: {},
};
</script>
<style scoped>
#mapdiv {
    width: 100vw;
    height: 100vh;
  }
.app-container {
  padding: 0px;
}
</style>