用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在线地图地图是否可以正常使用。

希望有用

目录
相关文章
|
2月前
|
缓存 JavaScript 前端开发
深入浅出:使用Node.js构建RESTful API
【9月更文挑战第3天】在数字化浪潮中,后端开发如同搭建一座连接用户与数据的桥梁。本文将带领读者从零开始,一步步用Node.js搭建一个功能完备的RESTful API。我们将探索如何设计API的结构、处理HTTP请求以及实现数据的CRUD操作,最终通过一个简单的实例,展示如何在真实世界中应用这些知识。无论你是初学者还是有一定经验的开发者,这篇文章都会为你揭示后端开发的奥秘,让你轻松入门并掌握这一技能。
96 3
|
4天前
|
JSON JavaScript API
深入浅出Node.js:从零开始构建RESTful API
【10月更文挑战第39天】 在数字化时代的浪潮中,API(应用程序编程接口)已成为连接不同软件应用的桥梁。本文将带领读者从零基础出发,逐步深入Node.js的世界,最终实现一个功能完备的RESTful API。通过实践,我们将探索如何利用Node.js的异步特性和强大的生态系统来构建高效、可扩展的服务。准备好迎接代码和概念的碰撞,一起解锁后端开发的新篇章。
|
15天前
|
JavaScript 中间件 API
Node.js进阶:Koa框架下的RESTful API设计与实现
【10月更文挑战第28天】本文介绍了如何在Koa框架下设计与实现RESTful API。首先概述了Koa框架的特点,接着讲解了RESTful API的设计原则,包括无状态和统一接口。最后,通过一个简单的博客系统示例,详细展示了如何使用Koa和koa-router实现常见的CRUD操作,包括获取、创建、更新和删除文章。
35 4
|
8天前
|
JavaScript 前端开发 NoSQL
深入浅出:使用Node.js构建RESTful API
【10月更文挑战第35天】在数字时代的浪潮中,后端技术如同海洋中稳固的灯塔,为前端应用提供数据和逻辑支撑。本文旨在通过浅显易懂的方式,带领读者了解如何利用Node.js这一强大的后端平台,搭建一个高效、可靠的RESTful API。我们将从基础概念入手,逐步深入到代码实践,最终实现一个简单的API示例。这不仅是对技术的探索,也是对知识传递方式的一次创新尝试。让我们一起启航,探索Node.js的奥秘,解锁后端开发的无限可能。
|
1月前
|
JavaScript 前端开发 API
探索Vue.js 3的组合式API:一种更灵活的组件状态管理方式
【10月更文挑战第5天】探索Vue.js 3的组合式API:一种更灵活的组件状态管理方式
|
1月前
|
JSON JavaScript 前端开发
使用 Node.js 和 Express 构建 RESTful API 服务器
【10月更文挑战第3天】使用 Node.js 和 Express 构建 RESTful API 服务器
|
2月前
|
敏捷开发 人工智能 API
如何快速部署大模型接口管理和分发系统:One-API
One API 是一个开源的接口管理与分发系统,支持多种大模型平台如 OpenAI、Google PaLM 2、百度文心一言等。通过统一接口访问不同大模型服务,简化工作流程并提高效率。适用于多模型集成项目、开发代理服务、教育研究及快速原型制作等多种场景。阿里云计算巢提供了快速部署方案,简化了部署过程。
|
1月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API服务器
【10月更文挑战第12天】使用JavaScript和Node.js构建简单的RESTful API服务器
17 0
|
1月前
|
JSON JavaScript API
Node.js RESTful API
10月更文挑战第8天
13 0
|
1月前
|
JSON JavaScript 前端开发
使用 Node.js 和 Express 构建 RESTful API
【10月更文挑战第3天】 使用 Node.js 和 Express 构建 RESTful API