何貞銘，胡小夏，劉學(xué)鋒

（1.長江大學(xué) 地球科學(xué)學(xué)院，湖北 武漢 430100）

基于Flex的WebGIS客戶端及其應(yīng)用

何貞銘1，胡小夏1，劉學(xué)鋒1

（1.長江大學(xué) 地球科學(xué)學(xué)院，湖北 武漢 430100）

通過對RIA技術(shù)與Flex開發(fā)模型的介紹，分析了基于Flex的WebGIS客戶端框架層次結(jié)構(gòu)及其相互之間的關(guān)系，并以武漢市直管公房地理信息系統(tǒng)為例，實(shí)現(xiàn)了Flex框架下WebGIS客戶端的構(gòu)建。

WebGIS；Flex；客戶端；RIA

近幾年，在Web領(lǐng)域出現(xiàn)了富互聯(lián)網(wǎng)應(yīng)用（RIA）技術(shù)，為WebGIS客戶端的發(fā)展帶來新的契機(jī)。RIA具有高度互動(dòng)性、豐富的用戶體驗(yàn)和功能強(qiáng)大的客戶端，同時(shí)也具有桌面應(yīng)用程序和Web應(yīng)用程序的雙重特點(diǎn)。Flex通常是指Adobe Flex，是一個(gè)用于構(gòu)建具有表現(xiàn)力的Web應(yīng)用程序，涵蓋了支持RIA的開發(fā)和部署的一系列技術(shù)組合，是RIA技術(shù)運(yùn)用的完美體現(xiàn)?；贔lex創(chuàng)建的界面表現(xiàn)能力一流，解決了異步調(diào)用、界面無刷新和跨平臺部署的問題，并且對于流媒體技術(shù)的支持最好。本文討論以RIA技術(shù)為核心的Flex框架代替?zhèn)鹘y(tǒng)的客戶端模式在WebGIS客戶端實(shí)現(xiàn)中的應(yīng)用。

1 傳統(tǒng)WebGIS客戶端模式

1.1 CGI模式

CGI是萬維網(wǎng)最重要的技術(shù)之一，是外部應(yīng)用程序與Web服務(wù)器之間的接口標(biāo)準(zhǔn)，是在CGI程序和Web服務(wù)器之間傳遞信息的規(guī)程[1]。依賴CGI技術(shù)實(shí)現(xiàn)的WebGIS工作模式為：用戶通過對Web瀏覽器的操作，向Web服務(wù)器發(fā)出請求，運(yùn)行于Web服務(wù)器上的CGI程序依據(jù)程序指令將請求發(fā)送至GIS服務(wù)器或直接在Web服務(wù)器上處理，GIS數(shù)據(jù)的處理主要在GIS服務(wù)器上完成，并由GIS服務(wù)器將處理好的結(jié)果返回給Web服務(wù)器，再至客戶端?；贑GI的WebGIS體系結(jié)構(gòu)如圖1所示。

由于基于CGI模式的WebGIS客戶端請求都集中在服務(wù)器上進(jìn)行處理，當(dāng)大量用戶同時(shí)對其發(fā)出請求時(shí)，CGI程序的反應(yīng)速度會明顯減慢，Web服務(wù)器的速度也受到限制，經(jīng)常發(fā)生頁面白屏現(xiàn)象。

1.2 Plug-in模式

圖1 基于CGI的WebGIS體系結(jié)構(gòu)圖

Plug-in譯為插件，是一種計(jì)算機(jī)應(yīng)用程序?；赑lug-in的WebGIS可將少數(shù)簡單的GIS數(shù)據(jù)，直接在客戶端進(jìn)行處理，無需請求服務(wù)器。這種方式減輕了服務(wù)器的工作量，也減少了網(wǎng)絡(luò)數(shù)據(jù)傳輸量。插件依賴于主應(yīng)用程序，不能獨(dú)立使用，通常在WebGIS客戶端中運(yùn)用的插件只是在客戶端增加一個(gè)具有圖形識別能力的應(yīng)用程序，對主應(yīng)用程序進(jìn)行一系列的功能擴(kuò)展，利用這些擴(kuò)展能力處理用戶部分請求，使客戶端承擔(dān)部分負(fù)擔(dān)來減輕服務(wù)器和網(wǎng)絡(luò)的壓力[2]。但是，這種模式并不能從根本上解決請求響應(yīng)速度緩慢的問題，同時(shí)由于瀏覽器的不同，開發(fā)插件運(yùn)用的語言不同，不利于用戶在后續(xù)使用過程中插件的更新和版本控制。

1.3 JavaApplet 與ActiveX控件

JavaApplet 與ActiveX控件是早期RIA技術(shù)運(yùn)用的體現(xiàn)，都需要嵌入網(wǎng)頁中運(yùn)行，功能強(qiáng)，但與服務(wù)端耦合程度高，初次使用時(shí)需下載安裝相應(yīng)程序[3,4]。這2種技術(shù)在WebGIS運(yùn)用中頗為類似，客戶端瀏覽器向服務(wù)器發(fā)出GIS數(shù)據(jù)處理請求，服務(wù)器接收到請求后，向客戶端返回GIS相關(guān)的JavaApplet 或ActiveX控件和GIS數(shù)據(jù)，并利用服務(wù)器返回的控件處理GIS數(shù)據(jù)。基于ActiveX控件的WebGIS系統(tǒng)結(jié)構(gòu)如圖2所示。JavaApplet可在Java環(huán)境下運(yùn)用，當(dāng)用戶使用支持Java瀏覽器訪問Java支持的網(wǎng)頁時(shí)，Applet會被下載到本地計(jì)算機(jī)上執(zhí)行，因此Applet的執(zhí)行速度完全不受網(wǎng)絡(luò)的影響。但是，由于瀏覽器對JavaApplet的支持有限，使得基于JavaApplet的WebGIS開發(fā)和應(yīng)用也受到了限制。ActiveX控件只適用于Windows平臺，有一定的操作系統(tǒng)限制，且其安全性差，無法滿足良好性能的WebGIS客戶端的實(shí)現(xiàn)條件。

圖2 基于ActiveX控件的WebGIS系統(tǒng)結(jié)構(gòu)圖

2 基于Flex的WebGIS客戶端技術(shù)與實(shí)現(xiàn)

2.1 Flex開發(fā)模型

Flex是一個(gè)高效、免費(fèi)、基于組件的開源框架，以RIA技術(shù)為核心，著力于表現(xiàn)層的構(gòu)建，采用GUI界面開發(fā)方式，使用基于XML的MXML標(biāo)記語言。Flex開發(fā)框架主要由5個(gè)部分組成：用于描述應(yīng)用程序界面的MXML語言、構(gòu)建數(shù)據(jù)模型的ActionScript腳本語言、一個(gè)基礎(chǔ)類庫、運(yùn)行時(shí)的即時(shí)服務(wù)和編譯器。MXML通常被用于用戶界面元素的定義，而使用ActionScript腳本語言來定義客戶邏輯和過程控制。Flex類庫為開發(fā)者提供了大量的組件、管理器和行為[5]。把運(yùn)行中的MXML和ActionScript編譯成Flash應(yīng)用程序，編譯后的應(yīng)用程序可直接運(yùn)行于Flash播放器或含有Flash播放插件的瀏覽器上。Flex開發(fā)模型如圖3所示。

2.2 Flex與服務(wù)端的通信

基于Flex的WebGIS系統(tǒng)的表現(xiàn)層和邏輯層是完全分離的，故客戶端與服務(wù)器的通信依賴于遠(yuǎn)程服務(wù)訪問。Flex框架下開發(fā)的客戶端與服務(wù)器之間的數(shù)據(jù)通信方式有HttpService、WebService和Remoting。在Flex應(yīng)用程序中調(diào)用HttpService對象send方法時(shí)，向服務(wù)端發(fā)出對指定URL的HTTP請求，并返回HTTP響應(yīng)。Flex支持格式設(shè)置為SOAP的消息且通過HTTP傳輸?shù)腤eb服務(wù)請求和結(jié)果。SOAP提供基于XML格式的定義，用于Flex應(yīng)用程序和Web服務(wù)之間交換結(jié)構(gòu)化和類型化信息[6]。Remoting通信方式則是通過訪問通道以獲得服務(wù)端對象，并將該服務(wù)對象通過序列化在客戶端運(yùn)行[7]。每種數(shù)據(jù)通信方式都有各自的特點(diǎn)，在運(yùn)用時(shí)可根據(jù)環(huán)境需要選擇合適的方式。本文中主要選用WebService的通信方式。

2.3 ArcGIS API for Flex

ArcGIS API for Flex是一款由ESRI公司推出的，用于富互聯(lián)網(wǎng)應(yīng)用程序開發(fā)的應(yīng)用程序接口，通過Flex API可將ArcGIS Server提供的地圖資源和其他資源嵌入到Web應(yīng)用中。Flex API為開發(fā)者在開發(fā)基于Flex 的Web應(yīng)用程序過程中，提供了GIS組件，使系統(tǒng)開發(fā)的工作具有一個(gè)快速、便捷的起點(diǎn)。

2.4 基于Flex的WebGIS客戶端框架與實(shí)現(xiàn)

基于Flex的WebGIS客戶端是利用Flex API和Flex開發(fā)模型框架來設(shè)計(jì)與實(shí)現(xiàn)的，在邏輯結(jié)構(gòu)上，基本可分為8個(gè)主要架構(gòu)元素，如圖4所示。

圖4 WebGIS客戶端架構(gòu)圖

ViewerContainer是所有其他架構(gòu)元素的根節(jié)點(diǎn)，作為一個(gè)實(shí)例化容器管理客戶端頁面上其他組件的實(shí)例，從整體框架入口啟動(dòng)系統(tǒng)程序時(shí)，ViewerContainer最先創(chuàng)建實(shí)例并初始化。

ConfigManager主要負(fù)責(zé)整個(gè)系統(tǒng)的config文件加載和配置信息的解析，并將解析后的信息存儲于數(shù)據(jù)結(jié)構(gòu)configData中，通過觸發(fā)AppEvent.CONFIG_LOADED將configData統(tǒng)一發(fā)布給其他組件使用。

UIManager根據(jù)配置文件中描述的客戶端界面風(fēng)格，配置信息定義一套系統(tǒng)的UI樣式表。

ControlBar主要為客戶端界面的搭建提供一系列常用的組件，如菜單選項(xiàng)、工具欄等。

MapManager是整個(gè)框架中地圖管理的核心，地圖管理器負(fù)責(zé)根據(jù)config文件中的配置信息初始化地圖控件、加載地圖圖層，并提供對地圖瀏覽、圖層切換、在線編輯、地圖導(dǎo)航等事件的響應(yīng)。

WidgetManager是對整個(gè)WebGIS應(yīng)用框架中系統(tǒng)功能模塊的管理。一個(gè)Widget封裝了一系列獨(dú)立且針對性強(qiáng)的業(yè)務(wù)邏輯，用戶可通過其完成一系列的任務(wù)。

DataManager管理并維護(hù)系統(tǒng)內(nèi)部的公共數(shù)據(jù)，使得系統(tǒng)中的各組件與Widget均能將公共數(shù)據(jù)發(fā)布到DataManager中或從中獲取其他組件發(fā)布的數(shù)據(jù)，從而實(shí)現(xiàn)各組件與微件之間的數(shù)據(jù)共享。

EventBus為事件總線，是不同組件之間進(jìn)行信息傳遞的核心，負(fù)責(zé)整個(gè)系統(tǒng)客戶端事件的分發(fā)與監(jiān)聽，實(shí)現(xiàn)同級組件、跨級組件之間的數(shù)據(jù)交互。

基于Flex框架的WebGIS客戶端應(yīng)用程序從設(shè)計(jì)到實(shí)現(xiàn)大致包括5個(gè)步驟：

1） Flash播放器或帶有Flash播放插件的瀏覽器加載并運(yùn)行系統(tǒng)編譯的swf文件；

2） 客戶端應(yīng)用框架加載XML格式的配置文件與客戶端界面樣式文件，用于客戶端應(yīng)用程序；

3） 根據(jù)應(yīng)用程序配置文件中提供的地圖相關(guān)服務(wù)地址，從GIS服務(wù)器上下載并加載地圖信息；

4） 應(yīng)用程序中微件管理器根據(jù)config文件中指定的URL，獲取相關(guān)的微件文件，并進(jìn)行加載；

5） 客戶端各組件加載完畢，等待用戶進(jìn)行交互。

基于上述架構(gòu)設(shè)計(jì)實(shí)現(xiàn)的WebGIS客戶端具有低耦合、高內(nèi)聚的特點(diǎn)[8]。對于系統(tǒng)開發(fā)者來說，這種方式不但簡化了代碼的維護(hù)和定制，還減小了模塊編寫過程中的阻力。根據(jù)職能的不同，將整個(gè)框架分為不同的管理模塊，使得系統(tǒng)架構(gòu)層次清晰明了，有利于后期的程序擴(kuò)展。

3 應(yīng)用實(shí)例

本文以武漢市直管公房地理信息系統(tǒng)為例，實(shí)現(xiàn)基于Flex框架的WebGIS客戶端設(shè)計(jì)。利用ArcGIS Server發(fā)布地圖服務(wù)，將發(fā)布的地圖服務(wù)的URL寫入config配置文件，并在配置文件中指定每個(gè)微件的URL，以便獲取地圖和微件的相關(guān)信息。在程序中創(chuàng)建一個(gè)主頁面FrmMain.mxml，指定為整個(gè)程序的入口，統(tǒng)一集中加載、初始化系統(tǒng)的主構(gòu)架組件。本系統(tǒng)界面主要分為6部分（見圖5）：界面頂端菜單欄中包括了統(tǒng)計(jì)分析模塊、樓盤表管理模塊、專題圖模塊和地圖輸出模塊，位于界面右端的地圖基礎(chǔ)操作模塊以及界面左端的優(yōu)保建筑管理模塊。依據(jù)Flex高度支持流媒體的特點(diǎn)，在本系統(tǒng)中嵌入了圖片、視頻等豐富的多媒體文件，增強(qiáng)了界面的表現(xiàn)能力，并基于Flex的強(qiáng)大動(dòng)畫特效，使得本系統(tǒng)具有良好的用戶體驗(yàn)。另外，依據(jù)RIA技術(shù)的特性，整個(gè)系統(tǒng)也可部署在網(wǎng)絡(luò)的桌面程序中，不需要等待頁面刷新來返回結(jié)果，可進(jìn)行異步響應(yīng)，用戶可同時(shí)進(jìn)行其他操作，使得用戶操作與界面表達(dá)流暢。

圖5 系統(tǒng)界面圖

[1] 張成才，孫喜梅，朱淘業(yè).幾種流行網(wǎng)絡(luò)地理信息系統(tǒng)的模式比較研究[J].計(jì)算機(jī)工程與應(yīng)用，2002,15:77-79

[2] 施晶晶，馬勁松.基于ActiveX控件的WebGIS設(shè)計(jì)原理[J].計(jì)算機(jī)應(yīng)用，2001(7)：68-69

[3] 鐘廣銳.基于Ajax的WebGIS客戶端解決方案研究[J].測繪科學(xué)，2007,32(5)：178-179

[4] 賈靜，耿襯.基于ArcGIS API for Flex的Web應(yīng)用初探[J].地理空間信息，2012,10(3)：114-118

[5] 劉俊，譚建軍，邵長高. 基于Flex的WebGIS框架設(shè)計(jì)與實(shí)現(xiàn)[J].計(jì)算機(jī)工程，2010,36(10):242-244

[6] 胡方霞，曾一，高旻.Web Services技術(shù)應(yīng)用與探討[J].計(jì)算機(jī)科學(xué)，2007，34(3):75-77

[7] 高曉川. Flash Remoting淺析[J].計(jì)算機(jī)與網(wǎng)絡(luò)，2006(22):53-54

[8] ESRI. FlexViewer Develope's Guide[EB/OL]. http://game.esrichina-bj.cn/,2008-11-21

Research and Application of WebGIS Client Based on Flex

byHE Zhenming

According to the description of RIA and Flex development model, the hierarchy and relationship of WebGIS client framework based on Flex was analyzed in this paper. And taking geographic information system of state-owned real estate of Wuhan for example,WebGIS client based on Flex framework was achieved.

WebGIS, Flex, client, RIA

P208

B

1672-4623（2014）02-0104-03

10.11709/j.issn.1672-4623.2014.02.036

2013-06-20。

項(xiàng)目來源：國家自然科學(xué)基金資助項(xiàng)目（41272136）。

何貞銘，碩士生導(dǎo)師，研究方向?yàn)镚IS研究及其應(yīng)用。