arcgis vue 添加图层优化_ArcGis for JavaScript 之 搭建Vue项目及加载底图

说明：

1.本文主要记录自己这段时间使用Arcgis for JavaScript的一些总结，其中包括如何调用，如何在前端页面进行对数据的查询，不同符号渲染，小部件，等相关内容

2.将使用官网提供的数据，后期可能自己发布相应的服务辅助

3.前面已有一篇文章介绍了Arcgis的产品体系，以及我们前端需要用到的离线部署，这里就不赘述了。

4.本次示例基于Vue框架,Arcgis for JavaScript API版本4.6

一、项目搭建及相关配置

1.了解如何开始

因为是使用的Vue框架，而esri官方也提供了esri-loader这个包，所以第一件事在GitHub上找到这个包(虽然只有不到两百个star)，然后阅读README.md,阅读后获得以下信息

安装:npm install --save esri-loader 或者 yarn add esri-loader

引入样式：@import url('https://js.arcgis.com/3.24/esri/css/esri.css');

没有介绍引入JS的方法，但是介绍了一种懒加载JS的方法，当然这个也可用于选择API的版本，也可以改变URL为本地离线部署的地址，例如：

const options = {

url: 'https://js.arcgis.com/3.24/' // 这里的API地址可以是官网提供的CDN，也可在此配置离线部署的地址

}

esriLoader.loadModules(['esri/map'], options) // 传入