您的位置:首页 > 运维架构 > Tomcat

ArcGIS API for JavaScript 4.x 在本地Tomcat上的配置

2020-08-27 16:52 1396 查看

ArcGIS API for JavaScript 4.x 在本地Tomcat上的配置

这次先说一说ArcGIS API for JavaScript 4.x 在本地Tomcat上如何来进行配置

文章目录

前言

ArcGIS API for JavaScript是ESRI根据JavaScript技术实现的调用ArcGIS Server REST API接口的一组脚本。当前的最新版本是Version 4.16。通过ArcGIS API for JavaScript可以将ArcGIS Server提供的地图资源和其它资源(ArcGIS Online)嵌入到Web应用中。那么我们在本地学习或开发如何来配置呢,以下就是配置流程。

一、环境准备

首先是安装Tomcat,我用的Tomcat7,关于安装Tomcat7可以借鉴Tomcat7.0安装及配置教程
下载ArcGIS API for JavaScript 4.14包,可以去官网下载,也可以下载我准备的API

二、配置流程

1.将开发包放在Tomcat目录的webapps下

2.用记事本打开文件下library>4.14>init.js

3.修改baseUrl,用文本编辑器打开init.js,搜索[HOSTNAME_AND_PATH_TO_JSAPI]

4.将[HOSTNAME_AND_PATH_TO_JSAPI]替换成localhost:9999/arcgis_js_v414_api/library/4.14/(这里9999是我的Tomcat端口)将https修改为http

5.配置dojo.js,步骤与修改内容与配置init.js一模一样,即参考3、4

6.配置完成,启动Tomcat服务器,在浏览器地址栏输入地址,查看是否配置成功,查看init.js,输入http://localhost:9999/arcgis_js_v414_api/library/4.14/init.js,如果出现下面的画面即init.js配置成功。

7.查看dojo.js,输入http://localhost:9999/arcgis_js_v414_api/library/4.14/dojo/dojo.js,如果出现下面的画面即dojo.js配置成功。

8.前端测试,新建html页面,测试代码为test.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>api配置测试-4.14</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="http://localhost:9999/arcgis_js_v414_api/library/4.14/esri/css/main.css">
<script type="text/javascript" src="http://localhost:9999/arcgis_js_v414_api/library/4.14/init.js"></script>
<script>
require([
"esri/views/MapView",
"esri/WebMap",
"dojo/domReady!"
], function(
MapView, WebMap
) {
var webmap = new WebMap({
portalItem: { // autocasts as new PortalItem()
id: "f2e9b762544945f390ca4ac3671cfa72"
}
});
var view = new MapView({
map: webmap,
container: "viewDiv"
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>

9.在浏览器打开HTML文件,就看到地图加载出来了,说明我们的配置成功了!!!

注:可能字体图标没有加载成功,浏览器提示跨域问题,需要在Tomcat进行跨域设置(参考)

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: