如何用arcgis api for js 搭框架

JavaScript013

如何用arcgis api for js 搭框架,第1张

【步骤1】打开VS2012,新建一个空白Web项目,添加一个index.html文件,这里使用的css和js文件都是前面步骤中配置好的本地服务器上的路径

【步骤2】运行index.html页面

前端:

1、老一代两大富应用(RIA)框架(目前已经停止更新):flex、silverlight

2、其他开源(早期项目较多):openlayer2、amap、bmap、ArcgisAPI4JS(3系列版本)

3、较新框架:openlayer3、cesiums、ArcgisAPI4JS(4.0之后版本)、

4、轻型框架(需要二次封装):WebGL(例如d3.js、three.js)

后端:arcgisServer、geoserver、mapserver

1,arcgis_for_javascript的使用方式

arcgis_for_javascript有两种使用方式,AMD和ES

其中AMD方式是用的require(),适合于dojo或者没使用前端框架

如果使用VUE等前端框架,则需要使用ES的方式,用的是import方式

2,在vue中使用arcgis_for_javascript

安装 :

npm install @arcgis/core

使用:

import "@arcgis/core/assets/esri/themes/light/main.css"

import Map from "@arcgis/core/Map"

import TileLayer from "@arcgis/core/layers/TileLayer"

import MapImageLayer from "@arcgis/core/layers/MapImageLayer"

import MapView from "@arcgis/core/views/MapView"

import FeatureLayer from "@arcgis/core/layers/FeatureLayer"

3,初始化的Map,无法赋值给data属性

可以看出,赋值后,变成了Proxy对象,解决的办法是不要在data中提前声明。

4.内网部署

以上虽然可以打开地图,但是,我的需求是部署在内网中,在内网中部署后发现会报错误,请求的还是arcgis的在线地址。问了朋友才知道,还需进行以下操作

1.在package.json包中 安装依赖包 "ncp": "^2.0.0";npm install ncp@2.0.0 --save

2.在package.json中加入script命令 "copy": "ncp ./node_modules/@arcgis/core/assets ./public/assets"

运行ncp命令,会将arcgis的包拷贝到项目目录 npm run ncp

3.在main.js主程序中引入配置文件,设置配置目录

import esriConfig from "@arcgis/core/config.js"

esriConfig.assetsPath = "./assets"

以上就完成了内网配置