webgis原理与应用第9章-arcgis api for javascript开发_第1页
webgis原理与应用第9章-arcgis api for javascript开发_第2页
webgis原理与应用第9章-arcgis api for javascript开发_第3页
webgis原理与应用第9章-arcgis api for javascript开发_第4页
webgis原理与应用第9章-arcgis api for javascript开发_第5页
已阅读5页,还剩104页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

WebGIS原理与应用朱进苏州科技大学环境学院2023年2月23日第9章ArcGISAPIforJavaScript开发2023/2/23slide2内容9.1ArcGISAPIforJavaScript概述9.2ArcGISAPIforJavaScript版的HelloWorld9.3ArcGISAPIforJavaScript部署9.4ArcGISAPIforJavaScript功能概述9.5ArcGISAPIforJavaScript与Dojo的关系9.6ArcGISAPIforJavaScript开发原理9.7ArcGISAPIforJavaScript开发环境2023/2/23slide39.1ArcGISAPIforJavaScript概述2023/2/23slide4ArcGISServerRESTAPI2023/2/23slide5ArcGISServerRESTAPIAPIhelp:

2023/2/23slide6ArcGISServerRESTAPIMapServer的Export操作2023/2/23slide7ArcGISAPIforJavaScript概述直接调用RESTAPI比较繁琐,需要传输URL参数,解析JSON等ArcGISAPIforJavaScript是ArcGISServer9.3新增的一套API通过面向对象的思想(封装、继承等)包装了RESTAPI,简化了程序员的工作,为创建WebGIS应用提供了轻量级的解决方案除了调用REST,JSAPI还为客户端用户的交互提供了很多功能2023/2/23slide8除了JSAPI,还有SilverlightAPI,FlexAPI,AndroidSDK,iOS

SDK都封装了RESTAPI,背后的功臣是RESTAPIArcGISAPIforJavaScript概述在客户端可以利用它来调用ArcGISServer提供的各种服务仅仅利用脚本调用,不需要服务端编程,降低了开发门槛目前的版本为3.162023/2/23slide9ArcGISAPIforJavaScript概述在2015年7月份发布了4.0Beta版本,更好的支持3D

2023/2/23slide10ArcGISAPIforJavaScript概述由于JS的跨平台性以及不用安装插件等特点,未来Esri主要支持JSAPISilverlightAPI和FlexAPI已是明日黄花,Esri不更新或者缓慢更新2023/2/23slide119.2ArcGISAPIforJavaScript版的HelloWorld2023/2/23slide12JSAPI版本的HelloWorldStep1-创建基本的HTML页面2023/2/23slide13JSAPI版本的HelloWorldStep2-在<head>部分添加ESRI的样式表和引用JS文件其中的CSS文件定义了小部件widgets和组件的样式3.16是API版本号,当发布新的API时,更新此版本号即可还可以引用Dojo主题的css,其中定义了用户界面的字体、颜色、大小等2023/2/23slide14JSAPI版本的HelloWorldStep3-加载地图模块利用<script>tag加载Dojo的map模块这里JS直接写在HTML中,复杂的项目JS写在单独的JS文件中Dojo的requie()函数用来加载模块JSAPI构建于Dojo之上2023/2/23slide15JSAPI版本的HelloWorldStep4-确保DOM可用dojo/domReady!用来确保DOM(文档对象模型,DocumentObjectModel)可用,DOM可用后,函数才可以运行!表示domReady是一个Dojo的AMDloaderplug-inDOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。换句话说,这是表示和处理一个HTML或XML文档的常用方法。2023/2/23slide16JSAPI版本的HelloWorldStep5-创建地图利用了esri/map模块里面的Mapclass“mapDiv”是Div的ID{}包括了Map的属性其它地图选项2023/2/23slide17JSAPI版本的HelloWorldStep6-定义样式Map填满浏览器窗口,在<head>tag里面增加2023/2/23slide18JSAPI版本的HelloWorld查看效果直接用浏览器打开也可以部署在IIS或者Tomcat服务器上2023/2/23slide19JSAPI版本的HelloWorld完整HTML文件2023/2/23slide209.3ArcGISAPIforJavaScript部署2023/2/23slide21JSAPI部署部署帮助网站:

离线包的下载jshelp/intro_accessapi.html2023/2/23slide22JSAPI部署部署

注册ESRI开发者账号下载API和SDK2023/2/23slide23JSAPI部署部署方式通过http引用:<scripttype="text/javascript"src=""></script>项目方式部署:<scripttype="text/javascript"src=“library/3.16/3.16/init.js"></script>2023/2/23slide24JSAPI部署部署arcgis_js_v316_api/arcgis_js_api/library/3.16/install_win.htmlInstallnotesfortheArcGISAPIforJavaScript两种build:NormalbuildCompactbuild-移除DojoDijit依赖2023/2/23slide25JSAPI部署部署OpenC:\Inetpub\wwwroot\arcgis_js_api\library\3.16\3.16\init.jsinatexteditorandsearchforthetext'[HOSTNAME_AND_PATH_TO_JSAPI]',andreplacethistextwith"<myserver>/arcgis_js_api/library/3.16/3.16/“C:\Inetpub\wwwroot\arcgis_js_api\library\3.16\3.16\dojo\dojo.js同上处理2023/2/23slide26JSAPI部署部署复制API和SDK至C:\inetpub\wwwroot\arcgis_js_api安装并启动IIS2023/2/23slide27JSAPI部署部署2023/2/23slide28JSAPI部署部署2023/2/23slide29JSAPI部署部署2023/2/23slide30JSAPISDKSDK包含了指南,API参考,Sample代码等2023/2/23slide31JSAPISDK指南2023/2/23slide32JSAPISDKAPI参考2023/2/23slide33JSAPISDKSample代码2023/2/23slide34JSAPISDKSample代码2023/2/23slide35JSAPISDKSample代码-在sanbox沙箱中运行2023/2/23slide36JSAPISDK论坛-Forum2023/2/23slide379.4ArcGISAPIforJavaScript功能概述2023/2/23slide38JSAPI功能概述功能空间数据展示:加载地图服务,影像服务,,WMS等。客户端Mashup:将来自不同服务器、不同类型的服务在客户端聚合后统一呈现给客户。图形绘制:在地图上交互式地绘制查询范围或地理标记等。符号渲染:提供对图形进行符号化,要素生成专题图和服务器端渲染等2023/2/23slide39JSAPI功能概述功能查询检索:基于属性和空间位置进行查询等地理处理:调用ArcGISforServer发布的地理处理服务(Geoprocessing服务),执行空间分析网络分析:计算最优路径、临近设施和服务区域。在线编辑:通过要素服务的图形、属性在线编辑2023/2/23slide40JSAPI功能概述功能时态感知:展示、查询具有间特征的地图服务或影像数据。影像处理:提供动态镶嵌、实时栅格函数处理等功能。地图输出:提供多种地图图片导出和服务端打印功能2023/2/23slide419.5ArcGISAPIforJavaScript与Dojo的关系2023/2/23slide42JSAPI与Dojo的关系概念JSAPI构建于Dojo之上,可以利用Dojo来屏蔽浏览器之间的差异2023/2/23slide43JSAPI与Dojo的关系Dojo随着Web2.0,Ajax(异步javascript和XML)和RIA(RichInternetApplications)的热潮,出现了各种Ajax开发工具包,Dojo是其中的一种,其它还有jQuery等Dojo是一个JS的开源DHTML工具包

2023/2/23slide44JSAPI与Dojo的关系Dojo特性更容易为Web页面添加动态能力利用Dojo组件,提升web应用的可用性和交互性其包加载机制和模块化结构,可以有高扩展性,减轻用户开发工作量屏蔽browser之间的差异2023/2/23slide45JSAPI与Dojo的关系Dojo模块三大模块:Core、Dijit和DojoXCore提供Ajax、事件、基于CSS的查询、动画以及JSON操作API等Dijit是一个可换皮肤,基于模板的Web界面控件库,包含WidgetDojoX包含一些新颖的代码和控件,例如DataGrid、Chart、离线应用等,还包含一个工具库(Util)模块,其中有单元测试框架、从源码生成文档的工具,以及JS资源打包及压缩工具2023/2/23slide46JSAPI与Dojo的关系Dojo模块间的关系2023/2/23slide47JSAPI与Dojo的关系Dojo基本函数2023/2/23slide48JSAPI与Dojo的关系Dojo基本函数2023/2/23slide49JSAPI与Dojo的关系Dojo基本函数2023/2/23slide50JSAPI与Dojo的关系Dojo基本函数2023/2/23slide51JSAPI与Dojo的关系Dojo基本函数2023/2/23slide52JSAPI与Dojo的关系Dojo基本函数2023/2/23slide53JSAPI与Dojo的关系Dojo基本函数2023/2/23slide54JSAPI与Dojo的关系Dojo基本函数2023/2/23slide559.6ArcGISAPIforJavaScript开发原理2023/2/23slide56JSAPI开发原理原理JSAPI开发的程序可以部署到Web服务器上,如IIS用户通过browser或移动客户端进行访问和操作模式1:JSAPI监控用户操作,将用户的操作按照ArcGSIServer提供的RESTAPI格式转化为HTTP请求,设置URL参数,提交给Server,Server收到请求处理后,返回JSON格式结果给客户端,JSAPI解析结果,并展现在browser中模式2:不需要与Server通信,如添加Graphic,测量模式,只在客户端生成图形等,只有当用户需要保存这些数据时才需要与server通信2023/2/23slide57JSAPI开发原理原理2023/2/23slide58JSAPI重要对象地图(Map)Map是承载图层的容器,主要用于呈现地图服务、影像服务,此外还可展示WMS服务等。需要HTML页面中的DIV容器作为根节点,所有地图中的子元素都作为DIV容器的子节点存在。Map中可以包含若干个Layer,一个layer只有被添加到map中才能显示出来2023/2/23slide59JSAPI重要对象地图(Map)Map对象初始化后包含一个默认的Graphic图层,可通过map.graphics获得,可以绘制自定义图形Map还包含一个现实要素属性信息的弹出框InfoWindow,一个map中只能包含一个弹出框,可以按照用户的定制来显示某一个要素的属性信息,甚至是图片和外部链接2023/2/23slide60JSAPI重要对象图层(Layer)图层是承载服务的载体(GraphicLayer除外),ArcGISServer将GIS资源作为服务发布出来,要想在browser端看到服务,就必须将服务和图层关联起来,不同的服务对应不同的图层。2023/2/23slide61JSAPI重要对象图层(Layer)2023/2/23slide62JSAPI重要对象图层(Layer)2023/2/23slide63JSAPI重要对象图层(Layer)后加入的图层在Map的最上面图层顺序:2023/2/23slide64JSAPI重要对象几何对象(Geometry)表示对象的显示形式,可以分为点、多点、线、矩形、多边形、ScreenPoint等,ScreenPoint以像素的方式表示点。2023/2/23slide65JSAPI重要对象几何对象(Geometry)2023/2/23slide66JSAPI重要对象符号(Symbol)定义了如何在GraphicLayer上显示点、线、面和文本,包括图形的颜色、边框线宽度、透明度等。每种符号都特定于一种类型(点、线、面和文本)。2023/2/23slide67JSAPI重要对象符号(Symbol)2023/2/23slide68JSAPI重要对象图形(Graphic)Geometry定义了对象的形状,Symbol定义了图形是如何显示的,Graphic可以包含一些属性信息,使用InfoTemplate展示属性。最终的Graphic添加到GraphicLayer中2023/2/23slide69JSAPI重要对象图形(Graphic)InfoTemplate用于定义InfoWindow的标题和内容格式TITLE和CONTENT可以包含任何HTML可以使用${Attribute}来获取graphic中的AttributevarinfoTemplate=newesri.InfoTemplate("${name}","名称:${name}<br/>经度:${x}<br/>纬度:${y}");2023/2/23slide70JSAPI重要对象渲染器(Render)Render是一个以图层为单位来改变符号的工具,而symbol改变符号是需要逐个设置的。2023/2/23slide71JSAPI重要对象要素集合(FeatureSet)相当于Geodatabase中的要素类,是Feature(要素)的集合FeatureSet中的每个Feature包括Geometry、属性、symbol和一个InfoTemplate。如果FeatureSet不包含Geometry,只包含属性,则可以将其看作一个表,其中每个Feature是一个行对象2023/2/23slide72JSAPI重要对象事件(Event)JSAPI是一种事件驱动的开发包,其中按照Dojo框架中的事件管理机制来实现,针对自定义的对象、控件提供了自定义的事件对象和一套触发、回调的方法事件监听方法:Dojo/_base/connect和on方法,其中on是推荐方法,不过考虑到兼容性,目前还支持Dojo的connect方法,以后可能会取消2023/2/23slide73JSAPI重要对象增加、删除事件响应-On方式增加事件响应代码:VarmyUnload=map.on(“unload”,unloadHandler);删除事件响应代码:myUnload.remove();2023/2/23slide74JSAPI重要对象增加、删除事件响应-Connect方式增加事件响应代码:VarmyUnload=connect.connect(map,“onUnload”,unloadHandler_connect);删除事件响应代码:connect.disconnect(myUnload_connect);2023/2/23slide759.7ArcGISAPIforJavaScript开发环境2023/2/23slide76开发环境2023/2/23slide77开发环境SetupaDevelopmentEnvironment

CodeAssistPlugins

2023/2/23slide78开发环境-VS2010

2023/2/23slide79开发环境-VS2010

2023/2/23slide80开发环境-VS2010

2023/2/23slide81开发环境-VS2010

2023/2/23slide82开发环境-VS2010

2023/2/23slide83开发环境-VS2010

2023/2/23slide84开发环境调试工具FirebugFirefox插件

2023/2/23slide85调试工具Firebug2023/2/23slide86调试工具Firebug2023/2/23slide87调试工具Firebug2023/2/23slide88调试工具Firebug2023/2/23slide89调试工具Firebug2023/2/23slide90调试工具Firebug2023/2/23slide91调试工具Firebug2023/2/23slide92调试工具Firebug2023/2/23slide93调试工具Firebug2023/2/23slide94调试工具Firebug2023/2/23slide95调试工具Firebug2023/2/23slide96调试工具Firebug控制台(Console)是Firebug的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息。Firebug内置一个console对象,提供5种方法,用来显示信息。最简单的方法是console.log(),可以用来取代alert()或document.write()。比如,在网页脚本中使用console.log("HelloWorld"),加载时控制台就会自动显示如下内容。2023/2/23slide97调试工具Firebug2023/2/23slide98调试工具Firebug根据信息的不同性质,console对象还有4种显示信息的方法,分别是一般信息()、除错信息console.debug()、警告提示console.warn()、错误提示console.error

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论