arcgis api for javascript入门教程

上传人:ji****en 文档编号:107706197 上传时间:2019-10-20 格式:PDF 页数:22 大小:1.32MB
返回 下载 相关 举报
arcgis api for javascript入门教程_第1页
第1页 / 共22页
arcgis api for javascript入门教程_第2页
第2页 / 共22页
arcgis api for javascript入门教程_第3页
第3页 / 共22页
arcgis api for javascript入门教程_第4页
第4页 / 共22页
arcgis api for javascript入门教程_第5页
第5页 / 共22页
点击查看更多>>
资源描述

《arcgis api for javascript入门教程》由会员分享,可在线阅读,更多相关《arcgis api for javascript入门教程(22页珍藏版)》请在金锄头文库上搜索。

1、 JavaScript 的入门 Lesson1:ArcGIS API for JavaScript 的 介绍 介绍 在为 ArcGIS 平台的一部分,ArcGIS API for JavaScript 使得开发者能够丰富的地理 web 应用程序。本次课程,将在 ArcGIS 平台的背景下学习 ArcGIS API for JavaScript 内容。 将了解平台提供的资源和解决方案,以及利用他们开发自己的地理 web 应用程序。 学习内容 ArcGIS 平台 开发者资源 API 结构 开发流程 学习目标 掌握 ArcGIS 开发者能够获取到的资源 列举出 ArcGIS API for Java

2、Script 的特性和组件 使用 API 在 html 页面中添加 Map ArcGIS 平台 ArcGIS 平台, 提供了丰富的 SDK 和 API 使开发者能够开发许多地理应用程序。 平台以 Web GIS 为核心,由 portal,应用程序,内容和设施组成用来支持以地理核心的工作流。开发者 通过这些工具能够在不同的 web 端和移动开发自己的应用程序用来创造,展示和分析地理 信息。 ArcGIS API for JavaScritp就是这样的API工具用来构建自己的web地理应用程序。 开发准备 为了使用 ArcGIS Javascript 开发一个 web 应用程序,你需要配置环境来获

3、取 GIS 服务和 来自 portal 和 ArcGIS Online 中的内容。 你也需要开发工具用来开发和测试应用程序。 一 般推荐配置如下工具: a. WebStorm 或者 Sublim Text 或者 NotePad+ b. Chrome 或 fireBug c. Fiddler 一般的解决方案是使用 WebStorm,Sublime Text 或者 NotePad+ 来进行代码的编写, 然后使用带开发者工具的 Chrome 浏览器进行测试。而使用 Fiddler 来监控前端和服务器 端的交互。 开发资源 ESRI 给出了许多的帮助文档,实例等资源来帮助开发者学习 ArcGIS AP

4、Is 和 SDKs。 ArcGIS API for JavaScript 主页 JavaScripte 的主页是 ArcGIS for Developers 网站 ( ) 的一部分。 开发者网站旨在帮助开发者发现如何构建富客服端的地理应用程序。该网站对不熟悉 Esri 和 API 的新开发者来说是一个巨大的资源库。Developers 网站还提供免费 Online 服务, 授权和其他 ArcGIS 平台中账号。 在该网站中开发者既能使用免费的开发和测试订阅也可企业级订阅,使用企业级订阅可以: 使用 ArcGIS 平台注册应用程序 创建托管的要素服务 使用和下载开发 sdks 测试 Online

5、 服务 ArcGIS API( )的主页使得开发者能开始获取和使用 API。该页面为新的 JavaScript 开发者提供了良好的入门资源也为熟练的开发者提供更为详细的 API 参考 GitHub ESRI 采用 GitHub(esri.github.io)作为其开源平台,开发者能够克隆和提交其中的代码 库。ESRI 的开发库严格按照 GitHub 的标准规范要求,包含 README 文件,问题处理和 wiki 说明文档。使用 GitHub 开发者能够实时获取 ESRI 发现的问题,有那些问题被处理, 新提交了那些代码等。 GeoNet GeoNet 为 ArcGIS 用户提供的一个社区来分享

6、和讨论 GIS 和地理空间相关的话题。 论坛中 的用户来自世界各地。 它不简简单单的为一个用来提问和获取答案的论坛, 其提供了一个社 交平台,通过平台能够分享许多的资源,包括博客,视频,文档,上传文件和其他内容。 ArcGIS 知乎 ArcGIS 知乎( )是 esri china 推出的自助问答社区。为中国的用 户提供关于 ArcGIS 产品的相关帮助。 ArcGIS for JavaScript API 的使用 ArcGIS API for JavaScript 的使用一般遵循四个部分,这四个部分如下图所示: 在使用 API 构建 web 应用程序之前,首先需要告知应用程序如何获取 API

7、,然后添加需要 的功能模块。 目前 API 的 sample 中给出的实例均是使用在线的 URL。当有新版本的 API 出现,可以直 接可以更换为新版本 URL。 API 支持异步模块定义(AMD)语法。使用 dojo 的加载其和 AMD 语法可以异步的加载 模块,提高应用程序的使用性能。代码如下所示: /load the map module form the ESRI namespace var map, dialog; require( “esri/map“,function(Map) /构建地图对象 var myMap=new Map(“divMap“,); ; 添加底图 在编写代码,

8、 需要给应用程序添加地图, 而 ArcGIS Online 中托管了一系列的底图。 ArcGIS API for JavaScript 中将这些地理底图加载到应用程序非常的便捷。在 Map 类的构造中包 含一个名为 baseMap 的可选参数。 该参数接受字符串值用来指定对应的地图。 如下图所示: 除了底图,ArcGIS 平台还提供了许多其他的即拿即用的内容,可以参考 Sample code 中的一些示例: 练习 1:创建一个简单的题图应用 完成本课程后,你已经掌握了使用 ArcGIS for JavaScript 的基本知识和技巧。这个时候你 想写一个简单的应用程序。在本次练习中,将学习如下

9、内容: 添加 ArcGIS API for JavaScript 应用 添加 Map 到应用程序中 调整地图的参数和样式 STEP1. 创建 html 页面 打开 WebStorm 创建或者打开一个 project 创建一个新的 index.html 页面 STEP2: 引用 ESRI 的 JS 库 打开 index.html 页面 打开浏览器访问 ,从主页中获取必须使用的和标签。 这些标签用来引用 ESRI 的 css 文件和 ArcGIS JavaScript 文件。拷贝这些链接到 index.html 页面中。除了在 中获取这些链接,也可以从 sample 中获取这些 链接。 注:如果是

10、在本地开发环境下,将这些链接替换成本地部署对应的文件链接。 STEP3: 添加地图 显示 Map 需要 API 的 esri/map 模块。ArcGIS JavaScript 的 API 使用的 AMD 模式来异 步加载模块。 使用 require() 语句添加模块 该模块添加两个参数, 第一个参数为模块名, 此处为 esri/map 和 dojo/domReady 。 第二个参数添加一个空的匿名函数 function().并使用 Map 作为匿名函数的别名参数。 在匿名函数中实例化一个 Map 类,并将实例赋值给 myMap 对象 在 html 的对象中,添加一个 div 用来展示 map。

11、此处将该 div 的 id 命名为 divMap 将 divMap 作为实例化 Map 类的第一个参数。后面的参数为可选参数,根据实际的情 况选择添加。 启动浏览器进行浏览,此时可以看到图 STEP4:调整地图参数和样式 目前地图默认的是全图显示,且地图没有充满整个浏览器,这个时候,需要指定和调整 地图选项。让地图打开就显示到某个特定位置,此处以 san Francisco 为例。 修改 Map 的构造参数 center: -122.45, 37.75, / longitude, latitude zoom: 13 修改 css,使得 hmtl,body 和 mydiv 的高度都为 100%

12、小结 通过本节课程了解 ArcGIS API for JavaScript 在整个 ArcGIS 平台中的作用;掌握从事 JavaScript API 开发能够获取到的资源以及构建一个 web 应用程序的基础流程。 思考题 1. 在 API 的主页能够获取那些资源? 2. 使用 ArcGIS API for JavaScript 的场景有那些? Lesson2:Map 操作 介绍 ArcGIS API for JavaScript 能够给地图添加不同的图层,包含 ArcGIS for Server 的地图服 务图层, graphics 图层和自定义图层。 除此之外使用ArcGIS Online

13、或者Portal for ArcGIS 创造一个 webmap 是一个用来分享包含图层,符号和弹出窗口,文件数据以及其他元数据 资源的好方式。 地图提供了许多的方法,属性和事件用来支持图层操作。ArcGIS API for JavaScript 包含 一系列的控件用来提升地图高级功能开发,如展示图例,切换地图和 HOME 键等。 学习内容 本次课程将学习主要以下方面的内容: 地图图层 控件的使用 地图事件 学习目标 完成本课程后,你将: 特定的场景下,能够指出使用图层类型 能够正常的使用地图相关控件 能够使用地图和图层事件 给 Map 添加数据 给地图添加数据通常有如下两种方式: 1. 使用地

14、图服务 2. 使用 web map 通常这两种方式不同时使用。 地图服务 地图服务通常由 ArcGIS for Server 的站点或者 portal(ArcGIS Online 或者 portal for ArcGIS)提供。服务通过切片或者动态绘制提供优化的地图显示,且提供对要素的搜索和 查询。 Web maps 用户能够登录门户(ArcGIS Online 和 Portal for ArcGIS)来创建 web map 分享资源。 Web map 以 JSON 表示地图信息和相关要素。服务信息,预定义的查询和弹窗和图层信息 都能够包含在 web map 中。通过 Map Viewer 能

15、够快速的创建 web map。从开发者的角 度看,使用 web map 具有如下好处: 能够在门户中快速构建和维护地图 减低应用代码量 能够使用 Web APPBuilder 和应用程序模板 给地图添加多个图层的时候,考虑以下几个方面的问题: 需要什么样的图层 图层该以什么样的顺序显示 图层的参考对地图影响 考虑上面三个问题,才能构建一个预期显示效果的地图。 图层选择 图层选择的标准依赖于数据源类型以及如何使用图层, 如下表中列出了四种最常见的图层以 及使用的场景。 图层类型 描述 使用场景 缓存图层 预先定义好的影像切片。由 于缓存是预先渲染好,且显 示速度较快。适合用来展示 不经常变化,相

16、对静止的数 据。 缓存图层最适合用来作为底 图,但其也可以用来作为连 续表达的栅格业务图层。 动态图层 基于动态的服务数据,动态 图层展示最近变化要素数 据。且支持动态投影变换。 适合用来展示常规变化的业 务图层 要素图层 可以使用它来展示动态服务 单一图层数据。除了动态投 影外,其还支持其他高级功 能,如选择和编辑。 当需要使用图层的高级功能 的时候,使用动态图层。如 想展示地图服务图层要素的 一部分,可以使用要素服务 的 definition expression 来添加过滤器。 Graphics 图层 用于展示临时的数据而不是Graphics 图层非常适合用 来 自 服 务 的 数 据 。 从 graphic 图层中添加,删除 和编辑 graphic 非常便捷。 来展示 GIS 分析结果,实时 车辆位置和其他类似短时间 在地图上层展示的数据。 除了上表列出的数据

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 电子/通信 > 综合/其它

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号