ArcGIS api for javascript 离线部署
一、说明:
1、本篇文章以及之后的相关的文章所使用的ArcGIS API for javascript 的版本是3.3。初学者为了学习简单,可以引用在线的 Javascript。但是如果只能连接内网,而假如无法连接互联网或者网速较慢的情况下,使用本地部署的 Javascript 是一个更佳的选择,我们在这里要部署到 iis上,电脑怎么安装IIS在这里不再赘述,不会安装的自己去问度娘。
2、部署步骤:
(1)、下载ArcGIS API for javascript引用文件
自己可以到官网下载,也可以在下面的百度网盘下载
链接:https://pan.baidu.com/s/1HK2VER8xXmGZGirCC6x25Q
提取码:jl76
(2)、部署到IIS
将下载的文件解压
用 记 事 本 打 开 : 解 压 目 录 \library\3.3\jsapi\init.js 文 件 , 将 文 本 中“[HOSTNAME_AND_PATH_TO_JSAPI]”,用“<myserver>/arcgis_js_api/library/3.3/jsapi/”替换,其中myserver 可以是机器名、IP 等,在这里我用的是 localhost,即将“[HOSTNAME_AND_PATH_TO_JSAPI]”替换为”localhost/arcgis_js_api/library/3.3/jsapi/ “
用 记 事 本 打 开 :解 压 目 录 \library\3.3\jsapi\ js\dojo\dojo\dojo.js 文 件 , 将“[HOSTNAME_AND_PATH_TO_JSAPI]”替换为“localhost/arcgis_js_api/library/3.3/jsapi/”。
整个替换过程可以用记事本的查找替换功能,如下图:
(3)、将修改后的文件连同解压目录内的所有文件拷贝到 Web 服务器根目录,以 IIS 为例,拷贝为wwwroot 目录下的 arcgis_js_api,最终的目录结构如下图:
说明:wwwroot 即为Web 服务器根目录,位于c盘中,我的wwwroot目录位于c盘中文件夹下
直接把解压目录中arcgis_js_api直接拷贝到wwwroot文件夹中即可
(4)、iis文档结构
(4)、示例
打开vs2012 新建项目 c# asp.net空web应用程序,并且添加HTML页面first.html
first.html页面代码如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>第一个地图应用</title>
<link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.3/jsapi/js/dojo/dijit/themes/tundra/tundra.css"/>
<link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.3/jsapi/js/esri/css/esri.css" />
<script type="text/Javascript" src="http://localhost/arcgis_js_api/library/3.3/jsapi/init.js"></script>
<style type="text/css">
.MapClass
{ width:900px;
height:600px;
border:1px solid #000;
}
</style>
<script type="text/Javascript">
dojo.require("esri.map");
dojo.addOnLoad(function () {
var MyMap = new esri.Map("MyMapDiv");
var MyTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer
("http://localhost/arcgis/rest/services/DZDT2012/MapServer");
MyMap.addLayer(MyTiledMapServiceLayer)
}
)
</script> </head>
<body class="tundra">
<div id="MyMapDiv" class="MapClass"></div> </body> </html>
运行 visual studio效果如下:
(5)、代码解释
<script type="text/Javascript">
dojo.require("esri.map");
dojo.addOnLoad(function ()
{
var MyMap = new esri.Map("MyMapDiv");
var MyTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer
("http://localhost/arcgis/rest/services/DZDT2012/MapServer");
MyMap.addLayer(MyTiledMapServiceLayer) } ) </script>
(1)dojo.require("esri.map");
ArcGIS API for Javascript 是基于 dojo 的,dojo 有一个特点就是模块化,当然 ArcGIS API for Javascript也不例外,因为所用的地图对象是在 esri.map 当中,所以需要通过 dojo.require("esri.map")引入。其实 Dojo.require 就是加载了 Javascript 文件,功能类似于 script 标签的作用,该函数完成后,就可以使用不属于 dojo.js 文件中的代码。
(2)dojo.addOnLoad
这段脚本是这个应用程序的核心,dojo.addOnLoad 是 dojo 的一个事件,它的作用有点类似window.onload 事件,只不过 window.onload 事件是直到页面中引用的所有的外部资源都加载后才触发,这意味着,我们必须等待所有的图片、对象、CSS 文件下载,如果页面包很多或外部资源很大或网络速度很慢,我们要等很长时间,而 dojo.addOnLoad 它在所有的模块都可用时才触发,无论你要使用什么包。 在 dojo.addOnLoad 事件中,往往写的是一个初始化的代码,如同在 windows.onload 事件中一样,在这里初始化了一个 Map 和一个 ArcGISTiledMapServiceLayer 对象,并将 ArcGISTiledMapServiceLayer 对象添加到 Map 对象中,这样地图上就有了内容,正如我们看到的一样。
ArcGIS api for javascript 离线部署的更多相关文章
- arcgis api for javascript本地部署加载地图
最近开始学习arcgis api for javascript,发现一头雾水,决定记录下自己的学习过程. 一.下载arcgis api for js 4.2的library和jdk,具体安装包可以去官 ...
- Arcgis api for javascript学习笔记(3.2X版本)-初步尝试
Arcgis api for javascript(3.22版本)官方地址 :https://developers.arcgis.com/javascript/3/ 1. 根据官方示例实现一个简单地图 ...
- ArcGis API for JavaScript学习——离线部署API
ArcGis API for JavaScript开发笔记——离线部署API 以3.18版API为例: 在加载图图前引用GIS服务是必须的.有两种方法,一是在线引用,而是离线部署引用. 在线引用: & ...
- ArcGIS API for JavaScript 4.x 本地部署之跨域问题解决法:CORS
众所周知,在离线部署ArcGIS API for JavaScript时,有时候会产生微件上的字体.符号变成方框的问题.这是遇到了跨域,只需要对所在服务器进行配置即可. 本篇使用的环境是:API配置在 ...
- ArcGIS API for JavaScript 4.x 本地部署之Nginx法
上篇ArcGIS API for JavaScript 4.x 离线配置之IIS法提到,如何用IIS配置ArcGIS jsAPI: 本篇则使用http下的Nginx配置,其原理基本一致.https的部 ...
- 【1】ArcGIS API for JavaScript 4.5/4.6 本地部署
惭愧,和我的学弟比起来,我所开始接触前端开发,ArcGIS API for JavaScript的时间和深度远远不及于他. 一年之尾,亦是一年之始,我也将正式开始我的博客生涯.本人在校学习并且做项目, ...
- ArcGIS API for JavaScript 4.x 本地部署之Apache(含Apache官方下载方法)
IIS.Nginx都说了,老牌的Apache和Tomcat也得说一说(如果喜欢用XAMPP另算) 本篇先说Apache. 安装Apache 这个...说实话,比Nginx难找,Apache最近的版本都 ...
- Arcgis api for javascript学习笔记(4.5版本) - 本地部署及代理配置
在开发过程中,由于api的文件比较多,没必要每个项目都将api加入到解决方案中.况且在VS中如果将api加入解决方案,在编写css或js代码时,由于智能提示需要扫描脚本等文件,会导致VS很卡.所以个人 ...
- 下载并部署 ArcGIS API for JavaScript 4.10
学习ArcGIS API for JavaScript 4.10 的第一步就是下载并部署该文件. 有的读者由于之间没接触过,不知道怎么下载和部署文件.这些读者要求作者详细的写一篇关于下载和部署的文章( ...
随机推荐
- django中引入json
try: from django.utils import simplejson as jsonexcept: import simplejson as json
- selenium firefox46.0.1设置禁用图片
firefox_profile = webdriver.FirefoxProfile()firefox_profile.set_preference('permissions.default.ima ...
- Solr Cloud的搭建使用
Solr的安装下载http://archive.apache.org/dist/lucene/solr/6.4.0/或者直接去官网下载最新版本网页指导 https://cwiki.apache.org ...
- Android性能专项测试之耗电量统计API
版权声明:本文为Doctorq原创文章,未经博主允许不得转载. https://blog.csdn.net/qhshiniba/article/details/49155979 参考文章:Androi ...
- Java内存区域与模拟内存区域异常
我把Java的内存区域画了一张思维导图,以及各区域的主要功能. 模拟Java堆溢出 Java堆用于存储对象实例.仅仅要不断地创建对象而且保证GC ROOTS到对象之间有可达路径避免被回收机制清除.就能 ...
- C 语言实例
C 语言实例 C 语言实例 - 输出 "Hello, World!" C 语言实例 - 输出整数 C 语言实例 - 两个数字相加 C 语言实例 - 两个浮点数相乘 C 语言实例 - ...
- 【Excle数据透视】如何创建多条件汇总的数据透视表
创建多条件的数据透视表,源数据如下: 插入数据透视表 根据需求拖拽字段(统计该地区下销售人员销售业绩) 数据透视结果 数据透视表布局的各个区域说明 区域 说明 数值 用于显示汇总值数据 行标签 用于将 ...
- eclipse svn插件 删除原账号信息重新登录
1.通过删除SVN客户端的账号配置文件 1)查看你的Eclipse中使用的是什么SVN Interface(中文:svn接口)windows > preference > Team ...
- HTTP头解读
Http协议定义了很多与服务器交互的方法,最基本的有4种,分别是GET.POST.PUT.DELETE.一个URL地址用于描述一个网络上的资源, 而HTTP中的GET.POST.PUT. DELETE ...
- A008-drawable资源
关于drawable资源笔者之前有写过两篇文章: Android-自己定义图像资源的使用(1) Android-自己定义图像资源的使用(2) 这里笔者就不做过多的赘述.我们从实际开发的角度去理解这个知 ...