用Tomcat8.5做Arcgis API for javascript的本地部署

简介: step1:1从arcgis官网上下载Arcgis api for JavaScript 4.3    https://developers.arcgis.com/javascript/latest/guide/release-notes/ps:前提是你需要有一个esri开发者账户否则不能下载。

step1:1从arcgis官网上下载Arcgis api for JavaScript 4.3    https://developers.arcgis.com/javascript/latest/guide/release-notes/

ps:前提是你需要有一个esri开发者账户否则不能下载。

step2:arcgis_js_v43_api文件夹中arcgis_js_api文件拷贝到tomcat根目录的webapps目录下

step3:(最重要的一步)--编辑tomcat\webapps\arcgis_js_api\library\4.3\4.3\dojo\dojo.js和tomcat\webapps\arcgis_js_api\library\4.3\4.3\init.js这两个文件,将[HOSTNAME_AND_PATH_TO_JSAPI]改成127.0.0.1:8080/(自己本机的tomcat服务地址)。

比如当前Tomcat下你的目录结构是这样:

这种情况下用于替换的串就是:localhost:8080/arcgis_js_api/library/4.3/4.3/

同理dojo.js在tomcat下的目录结构如下图

则dojo.js中用于替换的串就是:localhost:8080/arcgis_js_api/library/4.3/4.3/dojo/

step4:web页面中引用:

<link rel="stylesheet" href="http://localhost:8080/arcgis_js_api/library/4.3/4.3/esri/css/main.css">
<script src="http://localhost:8080/arcgis_js_api/library/4.3/4.3/init.js"></script>
就好了,给一个测试页面,如果可以运行出地图就说明部署好了:



<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>Load a basic WebMap - 4.3</title>
    <style>
        *{
            padding:0;
            margin:0;
        }
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>
    <link rel="stylesheet" href="http://localhost:8080/arcgis_js_api/library/4.3/4.3/esri/css/main.css">
    <script src="http://localhost:8080/arcgis_js_api/library/4.3/4.3/init.js"></script>
    <script>
        require([
            "esri/views/MapView",
            "esri/Map",
            "dojo/domReady!"
        ], function(
                MapView, Map
        ) {
            var map = new Map({
                basemap: "streets"

            });
            var view = new MapView({
                map: map,
                container: "viewDiv"
            });
        });
    </script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>


提示,如果运行不出来先看一下报错信息或查看一下使用的esri在线地图地图是否可以正常使用。

希望有用

目录
相关文章
|
1月前
|
JavaScript 前端开发 API
常用JavaScript 数组 API大全
常用JavaScript 数组 API大全
32 0
|
1月前
|
数据可视化 Linux API
如何在Linux使用docker部署Swagger Editor并实现无公网IP远程协同编辑API文档
如何在Linux使用docker部署Swagger Editor并实现无公网IP远程协同编辑API文档
|
1月前
|
API
egg.js 24.2写第一个api接口
egg.js 24.2写第一个api接口
71 0
|
3月前
|
数据可视化 Linux API
使用Docker安装部署Swagger Editor并远程访问编辑API文档
使用Docker安装部署Swagger Editor并远程访问编辑API文档
52 0
|
3月前
|
分布式计算 JavaScript 前端开发
JS中数组22种常用API总结,slice、splice、map、reduce、shift、filter、indexOf......
JS中数组22种常用API总结,slice、splice、map、reduce、shift、filter、indexOf......
|
2月前
|
Web App开发 JavaScript NoSQL
深入浅出:构建基于Node.js的RESTful API
在当今快速发展的互联网时代,RESTful API已成为前后端分离架构中不可或缺的一部分。本文旨在为初学者和中级开发人员提供一个清晰、简洁的指南,详细介绍如何使用Node.js构建一个高效、可维护的RESTful API。通过结合实际案例,本文将从API设计理念出发,深入讲解如何利用Express框架及MongoDB数据库实现API的增删改查功能,同时探讨如何通过JWT进行安全认证,确保数据传输的安全性。此外,文章还将简要介绍如何使用Swagger生成API文档,使得API的测试和维护更加便捷。无论你是希望提升现有项目的API设计,还是想从零开始构建一个新项目,本文都将为你提供一条清晰的道路
|
1月前
|
JavaScript 前端开发 API
JavaScript循环遍历常用的7种方法以及常用的数组 API
JavaScript循环遍历常用的7种方法以及常用的数组 API
35 0
|
1月前
|
分布式计算 DataWorks 大数据
DataWorks常见问题之使用API删除之前的部署文件失败如何解决
DataWorks是阿里云提供的一站式大数据开发与管理平台,支持数据集成、数据开发、数据治理等功能;在本汇总中,我们梳理了DataWorks产品在使用过程中经常遇到的问题及解答,以助用户在数据处理和分析工作中提高效率,降低难度。
|
1月前
|
Web App开发 JavaScript 前端开发
使用Node.js和Express构建RESTful API
使用Node.js和Express构建RESTful API
19 0
|
2月前
|
存储 负载均衡 API
部署大模型API的实战教程
部署大模型API的实战教程可以分为以下步骤: