请注意,本文使用的ArcGIS 版本为4.15
ArcGIS API for JavaScript
api是开发包
document是sdk,开发帮助文档,可以直接打开文件内的html
1.将两个压缩包复制到tomcat的webapps目录下解压;
2.\webapps\arcgis_js_v415_sdk,为方便修改文件名为arcgis_js,即\webapps\arcgis_js;
3.arcgis_js\arcgis_js_api,为方便修改为api,即\webapps\arcgis_js\api;
4.将api文件内的library文件,即arcgis_js_v415_api\arcgis_js_api\library复制到\webapps\arcgis_js目录下,即webapps\arcgis_js\api\library;
5.将tomcat的端口修改为8088,启动;
6.访问 http://localhost:8088/arcgis_js/api/library/downloads/index.html
1.打开 \webapps\arcgis_js\api\library\4.15\init.js 文件,查找 https://[HOSTNAME_AND_PATH_TO_JSAPI]dojo,修改为http://localhost:8088/arcgis_js/api/library/4.15/dojo
2.打开 \webapps\arcgis_js\api\library\4.15\init.js 文件,查找 https://[HOSTNAME_AND_PATH_TO_JSAPI]dojo,修改为
http://localhost:8088/arcgis_js/api/library/4.15/dojo
3.新建test.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>Test Map</title>
<link rel="stylesheet" href="http://localhost:8088/arcgis_js/api/library/4.15/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="http://localhost:8088/arcgis_js/api/library/4.15/esri/themes/light/main.css" />
<style>
html,
body,
#viewDiv {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
<script src="http://localhost:8088/arcgis_js/api/library/4.15/dojo/dojo.js"></script>
<script>
var myMap, view;
require([
"esri/Basemap",
"esri/layers/TileLayer",
"esri/Map",
"esri/views/MapView"
], function (Basemap, TileLayer, Map, MapView){
// --------------------------------------------------------------------
// If you do not have public Internet access then use the Basemap class
// and point this URL to your own locally accessible cached service.
//
// Otherwise you can just use one of the named hosted ArcGIS services.
// https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer
// --------------------------------------------------------------------
var layer = new TileLayer({
url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"
});
var customBasemap = new Basemap({
baseLayers: [layer],
title: "Custom Basemap",
id: "myBasemap"
});
myMap = new Map({
basemap: customBasemap
});
view = new MapView({
center: [-111.87, 40.57], // long, lat
container: "viewDiv",
map: myMap,
zoom: 6
});
});
</script>
</head>
<body class="claro">
<div id="viewDiv"></div>
</body>
</html>
在浏览器中打开后为:
至此,ArcGIS API for JavaScript部署完毕。