非框架项目
- 使用开发者身份在ArcGIS API for JS管网下载开发工具包。
-
设置ArcGIS API for JavaScript开发工具包。
修改下面路径的文件： arcgis_js_api\library\4.15\init.js arcgis_js_api\library\4.15\dojo\dojo.js 将https://\[HOSTNAME\_AND\_PATH\_TO\_JSAPI\]dojo 替换成：项目路径/assets/arcgis_js_api/library/4.15/dojo -
在HTML文件中的<head>部分中增加引用ESRI提供的样式表和js文件
<link rel="stylesheet" href="../../assets/arcgis_js_api/library/4.15/esri/css/main.css" /> <script src="../../assets/arcgis_js_api/library/4.15/init.js"></script> -
在<body>区域增加一个<div>元素，用于承载地图
<div id="map"></div> -
加载地图模块
<script> require([ "esri/map", "esri/layers/ArcGISTiledMapServiceLayer", "dojo/domReady!" ],function(Map, ArcGISTiledMapServiceLayer) { }); </script>
vue项目
-
首先是npm安装
npm install esri-loader -S -
安装完之后import一下
import esriLoader from 'esri-loader' -
样式文件可以在main.js中引入，也可以在当前组件引入，我选择的是在main.js中引
import '../public/src/assets/js/4.15/esri/themes/light/main.css'//这里用相对路径就可以了 -
最后加载就可以使用arcgis的api了，部分代码如下
const options = { url: "/src/assets/js/4.15/init.js"//这里千万小心，要用绝对路径，这是托管在本地服务器上的地址 } esriLoader //按需加载模块 .loadModules([ "esri/Map", "esri/views/MapView",//2d视图模块 "esri/views/SceneView",//3d视图模块 ],options) .then(([ Map, MapView, SceneView ])=>{ console.log(Map) }) - 如果控制台可以打印出Map对象，那么说明我们已经在vue中成功加载arcgis了
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。