arcgis 底图添加天地图图层（核心代码）

  initMap() {
    init().then(() => {
      this.createView('map-typhonn')

    })

  }

  async createView(div: string) {
    const win: any = window

    const layers = []

    const tileInfo = {
      dpi: 90.71428571427429,

      rows: 256,

      cols: 256,

      compressionQuality: 0,

      origin: {
        x: -180,

        y: 90

      },

      spatialReference: {
        wkid: 4490

      },

      lods: win.lods

    }

    const [WebTileLayer] = await getModules(['esri/layers/WebTileLayer'])

    const layer = new WebTileLayer({
      urlTemplate: `https://{subDomain}.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&FORMAT=tile&tk=${getTK()}`,

      tileInfo,

      spatialReference: {
        wkid: 4490

      },

      subDomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7'],

      fullExtent: {
        xmin: -180,

        ymin: -90,

        xmax: 180,

        ymax: 90,

        spatialReference: {
          wkid: 4490

        }

      }

    })

    if (layer) {
      layers.push(layer)

    }

    const layer2 = new WebTileLayer({
      urlTemplate: `https://{subDomain}.tianditu.gov.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&FORMAT=tile&tk=${getTK()}`,

      tileInfo,

      subDomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7'],

      spatialReference: {
        wkid: 4490

      },

      fullExtent: {
        xmin: -180,

        ymin: -90,

        xmax: 180,

        ymax: 90,

        spatialReference: {
          wkid: 4490

        }

      }

    })

    layer2.visible = true

    if (layer) {
      layers.push(layer2)

    }

    const layer3 = new WebTileLayer({
      urlTemplate: `https://{subDomain}.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&FORMAT=tile&tk=${getTK()}`,

      tileInfo,

      spatialReference: {
        wkid: 4490

      },

      subDomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7'],

      fullExtent: {
        xmin: -180,

        ymin: -90,

        xmax: 180,

        ymax: 90,

        spatialReference: {
          wkid: 4490

        }

      }

    })

    layer3.visible = false

    if (layer) {
      layers.push(layer3)

    }

    const modules = await getModules(['esri/Map', 'esri/Basemap'])

    const [Map, Basemap] = modules

    // 地图对象

    const customBasemap = new Basemap({
      baseLayers: layers

    })

    const map = new Map({
      basemap: customBasemap,

      layers: []

    })

    const MapView = await getModule('esri/views/MapView')

    this.view = new MapView({
      container: div,

      map,

      spatialReference: {
        wkid: 4490

      },

      extent: {
        xmax: 166.6205088463888,

        xmin: 88.92438150260338,

        ymax: 49.90942361300462,

        ymin: 1.6236947552848697,

        spatialReference: { wkid: 4490 }

      }

    })

    this.view.ui.remove('attribution')

    this.view.ui.empty('top-left')

    this.view.ui.empty('top-right')

    this.view.popup.autoOpenEnabled = false

    // this.view.watch('extent', (event: any) => {
    //   console.log(event)

    // })

    this.view.when(() => {
      // this.changeCloud()

      this.mouseOverHandler()

      this.drawCordon()

    })

  }