ArcGIS_Server_開發(fā)之Flex實(shí)踐.ppt

Esri西安辦事處彭劍 ArcGISServer開發(fā)之Flex實(shí)踐 FlexViewer介紹 FlexViewer介紹FlewViewer解析Widget開發(fā)示例常見問題及解決思路 大綱 FlexViewer介紹FlewViewer解析Widget開發(fā)示例常見問題及解決思路 大綱 為什么推出FlexViewer ArcGISServerforFlexAPIs很豐富 Flex也不錯(cuò) 但是 一個(gè)標(biāo)準(zhǔn)的GIS客戶端起碼包括哪些功能 ArcGISServer的地理處理服務(wù)怎么應(yīng)用 FlexViewer FlexViewer設(shè)計(jì)目標(biāo)FlexViewer的優(yōu)點(diǎn)高度可配置開發(fā)簡(jiǎn)單高內(nèi)聚低耦合高依賴注入 FlexViewer的界面元素 地圖的地址 功能模塊的組合都是由一個(gè)config xml來控制Widget 功能模塊 也是設(shè)計(jì)成一個(gè)良好的開發(fā)框架 開發(fā)簡(jiǎn)單 高度可配置 取決于開發(fā)者 配置文件說明 Config xml主要標(biāo)簽menusMapMapservice type alpha visible Extent initialextent fullextent xmin ymin xmax ymaxbasemapLivemapNavtoolWidgetsWidgetLabelMenuConfigLinks Widget 屬于FlexViewer的模塊每個(gè)Widget包含一個(gè)業(yè)務(wù)邏輯開發(fā)人員可以繼承BaseWidget來擴(kuò)展自定義功能 Widget開發(fā)模式 開發(fā)人員更加專注核心業(yè)務(wù)邏輯開發(fā)過程簡(jiǎn)便 繼承IBaseWidget 使用IWedgeTemplet布局 封裝業(yè)務(wù)邏輯 加入到config 編譯運(yùn)行 開發(fā)過程 com esri solutions flexviewer widgets SearchWidget swf FlexViewer介紹FlewViewer解析Widget開發(fā)示例常見問題及解決思路 大綱 FlexViewer剖析 IBaseWidgetWidgetTempletSiteContainerMapManagerWidgetManagerAppenvent IBaseWidget Widget基類 定義了基本屬性 狀態(tài) 地圖和配置文件和WidgetManager交互 管理每個(gè)Widget生命周期 WidgetClass IBaseWidget的實(shí)現(xiàn)類自定義的Widget必須繼承的基類WidgetManager會(huì)驗(yàn)證所有擴(kuò)展了BaseWidget的MXML或AS類擴(kuò)展了BaseWidget的類可被編譯為獨(dú)立的SWF IWidgetTemplate IWidgetTemplate接口定義了WidgetTemplate和BaseWidget之間進(jìn)行協(xié)作的方法 WidgetTemplate Widget模板是UI組件 為Widget提供了基本的UIlayout和行為包括風(fēng)格化的窗口面板 styledwindowpanel 標(biāo)題欄 titlebar 以及自定義的圖片按鈕 customimagebuttons 使用模板可以使開發(fā)者專注于業(yè)務(wù)邏輯開發(fā)而且整個(gè)程序風(fēng)格統(tǒng)一 模板也可以定制 必須實(shí)現(xiàn)IWidgetTemplate WidgetTemplateid wTemplate widgetClosed widgetClosedHandler event widgetOpened widgetOpenedHandler event 模板不是必須的也可以開發(fā)自定義的組件 SiteContainer FlexViewer中的容器 管理所有的組件負(fù)責(zé)事件的監(jiān)聽 分發(fā) 所有的全局事件都是從此進(jìn)行分發(fā)宿主 FlexViewer的管家 Config相關(guān)類 收集配置信息 根據(jù)配置設(shè)置頁(yè)面布局或者讀取業(yè)務(wù)資源ConfiigDataconfigManager不僅讀取全局的Config xml 單個(gè)Widget也是通過它來讀取通過http方式讀取 MapManager MapManager類是地圖有關(guān)對(duì)象的管理器配置文件設(shè)置的圖層 菜單等參數(shù)在這進(jìn)行解析定義了大量的事件 擴(kuò)展起來非常方便 當(dāng)然 你也可以自己定義事件再去擴(kuò)展 WidgetManager Widget管理器WidgetManager管理著widget的生命周期widget菜單點(diǎn)擊事件添加監(jiān)聽 創(chuàng)建 加載widget Appenvent 定義全局事件ID InfoPopup 彈出窗口 定義一些基本的動(dòng)作 彈出內(nèi)容的展現(xiàn)方式BaseWidget定義了showInfoWindow方法 由MapManager來監(jiān)聽 widgetShowInfo目前支持顯示文字 分行顯示 圖片 jpg png gif 視頻 Flv 更多的元素支持需要擴(kuò)展只需要對(duì)Link進(jìn)行解析加載即可 FlexViewer介紹FlewViewer解析Widget開發(fā)示例常見問題及解決思路 大綱 編寫Widget 使用WidgetTemplate模板訪問Map在Map上顯示W(wǎng)idget數(shù)據(jù)從Map接收數(shù)據(jù) 點(diǎn)擊 畫線 等 在Widget中控制導(dǎo)航開發(fā)無模板的Widget開發(fā)自定義WidgetTemplateWidget配置 使用WidgetTemplate 使用WidgetTemplate 第一步 將widget加到config xml文件中第二步 保存文件并且編譯工程第三步 運(yùn)行FlexViewer應(yīng)用程序 mywidgets MyFirstWidget swf 第四步 從菜單按鈕點(diǎn)擊MyFirstWidget 訪問Map FlexViewer是以地圖為中心的應(yīng)用 程序初始化后widget就可以訪問到map服務(wù)BaseWidget類中定義了Map變量 Widget加載后 widgetmanger就會(huì)將當(dāng)前活動(dòng)map對(duì)象傳遞給widget對(duì)象所有BaseWidget的派生類可以直接訪問map對(duì)象 訪問Map publicclassBaseWidgetextendsModuleimplementsIBaseWidget publicvarconfigData ConfigData publicvarconfigXML XML publicvarmap Map publicfunctionsetMap value Map void map value privatefunctionwidgetMenuClicked event AppEvent void if widgetTable containsKey id else if moduleTable containsKey url widget setMap map 訪問地圖 示例 在Map上顯示W(wǎng)idget數(shù)據(jù) AddGraphicsLayer CDATA privatefunctioninit void graphicPointSym newPictureMarkerSymbol widgetIcon 30 30 graphicsLayer newGraphicsLayer graphicsLayer symbol graphicPointSym map addLayer graphicsLayer 推薦每一個(gè)Widget創(chuàng)建一個(gè)GraphicsLayerGraphicsLayer 在Map上顯示W(wǎng)idget數(shù)據(jù) 當(dāng)Widget打開 最小化時(shí) 顯示 關(guān)閉GraphicsLayer privatefunctionwidgetClosedHandler event Event void graphicsLayer visible false privatefunctionwidgetOpenedHandler event Event void graphicsLayer visible true 從Map接收數(shù)據(jù) 點(diǎn)擊 畫線等 Widget可能需要接收來自Map的數(shù)據(jù) 如用戶與Map交互操作產(chǎn)生的點(diǎn) 線 面數(shù)據(jù)Widget模型通過內(nèi)嵌的setMapAction函數(shù)接收數(shù)據(jù) privatefunctionactivateTool void setMapAction Draw POINT ClickPoint drawEnd privatefunctiondrawEnd event DrawEvent void vargeom Geometry event geometry varpt MapPoint geomasMapPointAlert show Clicklocation pt x pt y setMapAction BaseWidget as publicfunctionsetMapAction action String status String callback Function void vardata Object tool action status status handler callback SiteContainer dispatchEvent newAppEvent AppEvent SET MAP ACTION false false data action Draw EXTENTDraw MAPPOINTDraw LINEDraw POLYLINEDraw POLYGONDraw MULTIPOINTDraw FREEHAND POLYLINEDraw FREEHAND POLYGONStatus 控制條上顯示的狀態(tài)信息callback 畫操作完成后MapManager調(diào)用的操作 在Widget中控制導(dǎo)航 可能需要在widget中控制地圖的導(dǎo)航 如關(guān)閉widget時(shí)關(guān)閉graphics圖層顯示并且使地圖處于Pan模式 WidgetTemplateid wTemplate widgetClosed widgetClosedHandler event privatefunctionwidgetClosedHandler event Event void graphicsLayer visible false setMapNavigation Navigation PAN PanMap 在Widget中控制導(dǎo)航 setMapNavigation BaseWidget as publicfunctionsetMapNavigation navMethod String status String void vardata Object tool navMethod status status SiteContainer dispatchEvent newAppEvent AppEvent SET MAP NAVIGATION false false data navMethod Navigation PANNavigation ZOOM INNavigation ZOOM OUTSiteContainer NAVIGATION ZOOM FULLSiteContainer NAVIGATION ZOOM PREVIOUSSiteContainer NAVIGATION ZOOM NEXTstatus 控制條上顯示的狀態(tài)信息 開發(fā)無模板的widget 模板不是必須的 如顯示一個(gè)時(shí)鐘 開發(fā)自定義WidgetTemplate 自定義widgetTemplate必須實(shí)現(xiàn)iwidgetTemplate接口 即實(shí)現(xiàn)接口中的setTitle setIcon和setState函數(shù) Widget內(nèi)容配置 每個(gè)widget可以有自己的配置文件配置文件的位置在config xml中指定WidgetManager將widget配置文件的url傳遞給BaseWidget BaseWidget加載并解析xml配置文件 保存為一個(gè)configXML變量 一個(gè)XML類型的AS變量 Widget加載完后可以直接訪問configXML變量 relative urlpath MyNewWidget swf Widget配置文件示例 http localhost ArcGIS rest services Geometry GeometryServer32618千米米SquareMetersSquareKilometersSquareFeetSquareMilesAcresHectaresPolutionSourceshttp localhost ArcGIS rest services ps MapServer 0RegionCode value PSName PSCode RegionCode FlexViewer介紹FlewViewer解析Widget開發(fā)示例常見問題及解決思路 大綱 如何與業(yè)務(wù)系統(tǒng)結(jié)合 FlexViewer是很好 但僅僅是純GIS應(yīng)用 業(yè)務(wù)系統(tǒng)是一個(gè)復(fù)雜的系統(tǒng) 以數(shù)據(jù)為導(dǎo)向 GIS只是其中的一小部分 有時(shí)候還那么可有可無FlexViewer如何迎合業(yè)務(wù)系統(tǒng) 嵌入到其他系統(tǒng)里面 怎么和其他的業(yè)務(wù)接口通信 其實(shí) 這是Flex層面的問題FlexViewer能否實(shí)現(xiàn)在線編輯 GISRIA開發(fā)都要面對(duì)的問題按權(quán)限加載地圖 大數(shù)據(jù)量下的業(yè)務(wù)過濾 結(jié)合幾種方式 WebServiceHttpRemoteObject BlazeDS JavaScript 在線