ArcGISRIA开发实践ESRI中国(北京)有限公司张政【背景篇】RIA介绍•2002年Macromedia公布FlashMX和FlashRemoting,并同时推出新词:RIA•RIA是网络应用软件•RIA提供类似桌面系统的使用性•传统RIA运行于浏览器中•RIA面向功能和效用,而不是文档•RIA-富互联网应用•RIA相比传统Web的优势•RIA的局限性•目前主流RIA技术及特点RIA相比传统Web的优势•表现力丰富•网络效率高•交互能力强•面向操作系统和浏览器透明•沙箱提供更可靠的安全性•易于与现有系统集成RIA不光是界面好看•RIA=Richx(用户需求+用户使用性+用户体验)=Richx(Needs+Usebility+UseExperience)RIA的局限性•客户端引擎的下载和安装•目前难于做SEORIA大格局富用户端(RichClient)在个人计算机的虚拟机上运行。能存取本机资源。能下线运行富互联网应用(RIA)在浏览器中嵌入插件中运行。受制于浏览器和插件的安全屏障(sandbox)。拥有比HTTP更多通讯连线方式。轻捷用户(ThinClient)运行于浏览器之中。受制于浏览器的安全性能,基本的HTTP通讯连线方式HTMLHTMLhttpRequestJavaAppletFlexAIRDHMLFlashFirefoxJavaJavaWebStartRemotingScriptingActiveXSilverlightWPF.NetJavaScriptJavaFXGoogleGWTGear开放基于各种标准广泛有浏览器就能使用没累赘只有网页,没有程序装载发布一切都在网络服务器上操作富使用感受类似桌面系统的界面,多媒体,全进程应用程序本地处理和集成快速,高性能,利用本地资源界面工具强大多样的界面开发工具,方便快捷程序开发下线功能不需要随时在线目前主流RIA技术及特点•AdobeFlex/Flash•MicrosoftSilverlight•SunJavaFX•CurlArcGISServer的REST接口•REST的概念•通过REST的接口使用ArcGIS功能REST的概念•资源通过URI来指定和操作•对资源的操作包括获取、创建、修改和删除资源,这些操作正好对应HTTP协议提供的GET、POST、PUT和DELETE方法•连接是无状态性的•能够利用Cache机制来提高性能通过REST的接口使用ArcGIS功能•REST服务目录Java::•清空REST的缓存•REST管理界面[:8399]/arcgis/rest/admin•某个地图服务RESTURL:•点击“ExportMap”链接•跳转URL:=-198.000000454545,-99.0000004545455,198.000009545455,99.0000095454545•总结:ArcGISServerREST接口中,请求服务的URL一般应该是这样的:[:port]/arcgis/rest/services/服务/服务类型/操作?参数API之困扰•ESRI技术及众多API–ArcObject,SOAP,ArcWebServiceAPI,WebADF,WebADFJavaScript(AJAX),REST,JavaScriptAPI,ArcGISAPIforFlex,ArcGISAPIforSilverlight•怎么选择API?•怎样的选择是更好的投资?•ESRIAPI的进化方向?用户端API比较应用运行环境服务器端及用户端AJAX浏览器(browser)浏览器的Flash开发环境VisualStudio或NetBeanIDENotepad或其它文本编辑器FlexBuilder或文本编辑器及FlexSDKcompiler程序语言.Net(C#,APS),JavaJavaScriptMXMLandActionScriptArcGIS访问SOAPendpointsandArcObjectRESTAPIRESTAPIArcGISWebADFArcGISJavaScriptAPIArcGISAPIforFlex【Flex篇】【ArcGISFlexAPI基础】Flex的历史和现状•Flash•Flex•Adobe与Macromedia什么是FlexFlex是一个应用开发构架(framework)•实现RIA的应用开发•基于AdobeFlash平台•提供免费FlexSDK•提供FlexBuilder开发工具•可在97%的PC和几乎所有的浏览器上运行AdobeFlashPlayerAdobeFlexBuilderAdobeFlexSDKCompilerFlexSDKFlexCodeMyApp.swf.html+.jsWebServerFlex技术核心•FlashPlayer•AIREngine•ActionScript•MXML开发Flex应用过程AdobeFlexBuilderMXMLActionScriptAdobeFlashPlayerAdobeFlexSDKCompilerFlexSDKMyApp.swf.html+.jsWebMapWebServerArcGISAPIforFlexCSS12431234用FlexBuilder来编写MXMLandActionScript程序并使用FlexSDK和ArcGISAPIforFlex把MXML/ActionScript/CSS代码编译成.swf文件(Flash)把.swf文件和HTML框架放到网络服务器上从浏览器中运行访问HTML框架页来运行Flex程序ArcGISFlexAPI概述•ArcGIS在RIA领域的第一个产品•开发运行于浏览器中的Web应用或者运行于桌面的AIR应用•非常便捷地使用地图功能和REST接口提供的GIS查询及分析功能•专注于GIS功能的实现而不重复地创造组件一些基本概念•MapServiceLayer•GraphicLayer与Graphic•Geometry•SymbolMapServiceLayer•对应ArcGIS发布的地图服务•不同种类的地图服务将会对应不同的MapServiceLayerArcGISDynamicMapServiceLayerArcGISServer发布的动态地图服务ArcGISTiledMapServiceLayerArcGISServer发布的切片地图服务ArcGISImageServiceLayerArcGISImageServer发布的影像服务ArcIMSMapServiceLayerArcIMS发布的地图服务GraphicLayer与Graphic•客户端的图层•根据各种情况动态地在客户端显示一些符号化的几何对象——Graphic•Graphic是一个可视化的、可响应鼠标事件的客户端要素•Graphic3个很重要的属性:geometry、symbol和attributesGeometryMapPoint点Multipoint多点Polyline多段线Polygon多边形Extent边界范围Symbol•定义了Geometry使用什么符号表现出来•一般MarkerSymbol、LineSymbol、FillSymbol•还有TextSymbol、InfoSymbol等其它符号帮助进行其它信息的辅助表达SimpleMarkerSymbol简单点符号SimpleLineSymbol简单线符号SimpleFillSymbol简单填充符号CartographicLineSymbol制图线符号,可定义端点、折点样式PictureMarkerSymbol图片点符号PictureFillSymbol图片填充符号TextSymbol文字符号InfoSymbol信息提示符号CompositeSymbol复合符号[1]支持JPG、GIF、PNG、SWF、SVG格式[2]上面若干种符号的组合地图功能组件•Map组件•Navigation工具•Draw工具•InfoWindow窗口Map组件•ArcGISFlexAPI中唯一的可视化组件•ArcGISFlexAPI中所有的操作和功能都会在Map中进行•Map中包含各种Layer•Map中的Layer有两种,一种是对应某个地图服务的MapServiceLayer、一种是用以绘制自定义要素的GraphicLayer•添加Map和Layer的代码:esri:Mapid=mapesri:ArcGISTiledMapServiceLayerurl=:Map•控制地图缩放的zoomSlider、地图比例尺scaleBar以及ESRI的logo•可以隐藏•zoomSlider和scaleBar除了可以被隐藏掉,还可以通过定制样式来改变外观•以下的CSS代码将Map的zoomSlider移到了右边:mx:Style.mapStyle{navigation-style-name:navigationStyle;}.navigationStyle{top:6;right:6;}/mx:Styleesri:Mapid=“map”styleName=“mapStyle”/•地图四周的导航按钮•地图中心的十字符号•拉框缩放的方框样式•Map有很灵活的可配置性•各种元素的外观也很容易定制•如果有特殊的需要,Map也可以通过隐藏所有元素,你则可以在此基础上加上自己的内容Navigation工具•提供了对Map进行导航的诸多功能•它可以实现漫游、拉框放大、拉框缩小等类似ADF中Tool的功能和前一视图、后一视图、全图等类似ADF中Command的功能•它并不是一个工具条,而是提供了一些功能,你可以把Flex组件绑定到Navigation的功能上•Navigation中漫游、拉框放大、拉框缩小等功能和工具条按钮的绑定•借助Flex中的ToggleButtonBar作为这些功能的宿主mx:ToggleButtonBarid=tbbitemClick=itemClickHandler(event)mx:dataProvidermx:Arraymx:String漫游/mx:Stringmx:String拉框放大/mx:Stringmx:String拉框缩小/mx:String/mx:Array/mx:dataProvider/mx:ToggleButtonBarmx:Script![CDATA[privatefunctionitemClickHandler(event:ItemClickEvent):void{switch(event.index){case0:{nav.activate(Navigation.PAN,true);break;}case1:{nav.activate(Navigation.ZOOM_IN,true);break;}case2:{nav.activate(Navigation.ZOOM_OUT,true);break;}}}]]/mx:Scriptesri:Navigationid=navmap={map}/•Navigation中前一视图、后一视图、全图等功能和工具条按钮的绑定•前一视图、后一视图的按钮并不是一直可用mx: