还在为arcgis api for js离线部署烦恼吗？来吧，看这边文章就对啦。
一、离线部署好处
首先我们说一下为什么明明可以在线调用arcgis api 为什么要离线部署呢。
1.离线部署可以在没有网络的时候使用（但是你要加载在线地图服务的话就必须要连接网络啦）。
2.离线部署相比在线调用速度更快，因为只需从本地加载不需要经过网络。
二、本文方法和部署到服务器方法对比
1.说起arcgis api for js 的离线部署，一般都会将api文件部署到IIS或者Tomcat服务器上，这样做的最大好处是你的网页文件可以存放在任何位置，不需要和api接口文件放在一起，但是坏处就是需要先安装服务器，还需要一些配置，对于新手来说不太友好，且过程较为繁琐。如果你想看部署到服务器的过程的话请进去看吧，嘻嘻，我师兄的文章（https://blog.csdn.net/yy284872497/article/details/78878435）
2.本文方法的一个小坏处就是需要将api文件和你的网页文件放在一个目录下（其实这个没什么影响啦），最大的好处就是简单、简单、简单！简单啊朋友们，心动嘛？好的嘛 ，开始啦！
三、api文件下载
1.首先先到百度搜索 arcgis api for js，进入官网。
2.找到Get the api按钮，如图所示：
3.找到下载页面，选择你想要的版本进行下载，如图所示：（注意下载的时候需要有arcgis的账号，按照提示注册即可）
四、离线配置
1、首先将你现在的文件解压，然后进去找到以你的api版本号命名的文件夹，我的版本是4.1.0，所以我打开4.1.0这个文件夹，文件夹里面的内容如下：
2.将4.1.0这个文件夹拷贝出来（也可以不拷贝出来，就在原位置操作），随便放在一个位置，然后把文件夹名字改成你想要的名字（不改也可以），这里我将文件夹名字改成“whe”。
3.打开whe文件夹，找到并打开init.js文件和dojo文件夹下的dojo.js文件，crtl+f搜索找到[HOSTNAME_AND_PATH_TO_JSAPI]这串文字，然后将包含这串文字的引号里面里的内容用"你修改的文件夹名字/dojo"替换,这里我用"whe/dojo"替换，好啦，大功告成了，让我们来测试一下吧！
五、Test
本文测试的是没有使用dojo的情况，如果要使用Dojo的话，请将你的网页在IDEA中打开，因为IDEA为自动建立一个站点，其实IIS和Tomcat都是建立了一个站点。
1.首先在whe文件夹的同一目录中新建一个名为test的txt文件，然后打开api官网，在Sample code选项卡中点击Intro to SceneView，然后将里面的代码复制到你的txt文件中，然后把下图一的内容用下图二中的内容代替,注意里面的whe内容用你修改的文件夹的名字代替哦。然后就可以运行试一试啦。
2.这是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Intro to SceneView - Create a 3D map</title>
<style>
html, body, #viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="whe/esri/css/main.css">
<script src="whe/init.js"></script>
<script>
require([
"esri/Map",
"esri/views/SceneView"
], function(Map, SceneView){
var map = new Map({
basemap: "streets",
ground: "world-elevation"
});
var view = new SceneView({
container: "viewDiv", // Reference to the scene div created in step 5
map: map, // Reference to the map object created before the scene
scale: 50000000, // Sets the initial scale to 1:50,000,000
center: [-101.17, 21.78] // Sets the center point of view with lon/lat
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
3.效果图
325
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
