esri-loader + ArcGIS API 3.x加载ArcGIS Server地图服务教程

默认是加载4. x 的api在线连接。使用3.x的api需要手动调用链接。

1. template部分，需要绑定id，和纯js的相同

<template>
  <div id="map"></div>
</template>

2. 导包部分

import { loadScript, loadCss, loadModules } from 'esri-loader'

3. export接口部分

export default {
  name: 'web-map',
  mounted() {
    loadScript({ url: 'https://js.arcgis.com/3.28/' })
    loadCss('https://js.arcgis.com/3.28/esri/css/esri.css')

    loadModules(['esri/map', 'esri/geometry/Extent', 'esri/layers/ArcGISDynamicMapServiceLayer', 'dojo/domReady!'], { css: true })
      .then(([Map, Extent, ArcGISDynamicMapServiceLayer]) => {
        var tjUAVurl = 'http://localhost:6080/arcgis/rest/services/shopping/payMon_zenzhag/MapServer'
        var map = new Map('map', {
          // extent: extent1,
          logo: false
        })
        var tjUAVLayer = new ArcGISDynamicMapServiceLayer(tjUAVurl)

        map.addLayer(tjUAVLayer)
      })
  },
  beforeDestroy() {
    if (this.view) {
      // destroy the map view
      this.view.container = null
    }
  }
}

免责声明：本文系网络转载或改编，未找到原创作者，版权归原作者所有。如涉及版权，请联系删