嚴 安,徐煜明
(南寧鐵路局信息技術(shù)所,1.工程師;2.助理工程師,廣西 南寧 530003)
隨著信息技術(shù)的不斷發(fā)展和普及,鐵路局安監(jiān)室利用Excel電子表格統(tǒng)計和分析安全生產(chǎn)日況信息的方式已難以適應(yīng)鐵路快速發(fā)展的步伐。在利用Flex改進安全生產(chǎn)日況信息的統(tǒng)計和分析之前,依靠信息技術(shù)解決上述問題的方法常常因為HTML的局限性而效果不佳,但Flex卻提供了一種新的技術(shù)以解決這些問題。
Flex技術(shù)是目前最流行的RIA(富互聯(lián)網(wǎng)應(yīng)用系統(tǒng))開發(fā)技術(shù)之一,它是開發(fā)Web應(yīng)用的有效工具〔1〕。在傳統(tǒng)的開發(fā)模式中,用PHP、ASP、JSP等技術(shù)來開發(fā)Web應(yīng)用,需要依靠瀏覽器的動態(tài)解釋才能夠正常顯示和執(zhí)行,這樣的開發(fā)方式經(jīng)常會給代碼調(diào)試帶來難度。在開發(fā)過程中,界面外觀的調(diào)試非常耗時耗力,往往同一代碼在不同的瀏覽器或同一瀏覽器的不同版本下會有不同的外觀和不同的動作效果〔2〕。Flex便是人們所期待的能夠解決上述問題的方法之一。
1.1 Flex組成元素
1)MXML:基于XML描述應(yīng)用程序界面的語言。
2)ActionScript:符合ECMA(歐洲計算機制造商協(xié)會)標準的腳本語言,負責(zé)處理業(yè)務(wù)邏輯和業(yè)務(wù)建模。
3)Flex SDK:Flex的基礎(chǔ)類庫。
4)通信服務(wù):Flex支持Adobe公司自定義的通信協(xié)議AMF,它能夠?qū)lash/Flex對象快速序列化、反序列化,采用二進制壓縮傳輸數(shù)據(jù),具有數(shù)據(jù)安全性高、傳輸快的優(yōu)點。
1.2 Flex框架結(jié)構(gòu) Flex框架的基本模型見圖1所示。其基本原理是:通過Flex編譯器Flex Builder x.0將 MXML 文 件 編 譯 成 SWF 文 件〔3〕,然 后 由FlashPlayer執(zhí)行該SWF文件。
從圖1可以看出Flex應(yīng)用是多層結(jié)構(gòu)。Flex編譯器可以把MXML、ActionScript以及一些Flex類庫編譯成SWF文件,由FlashPlayer在客戶端執(zhí)行SWF文件,實現(xiàn)對應(yīng)用的訪問。
Flex主要用于前端用戶交互的解決方案框架,當(dāng)復(fù)雜業(yè)務(wù)邏輯的信息系統(tǒng)進行開發(fā)時,服務(wù)端一般會選用比較成熟的架構(gòu),F(xiàn)lex可以方便地實現(xiàn)與服務(wù)端的交互。
2.1 Web應(yīng)用的整體框架 Web應(yīng)用的整體框架見圖2所示,系統(tǒng)可分為客戶端、服務(wù)器端。Flex程序在瀏覽器中運行,由瀏覽器插件FlashPlayer負責(zé)解釋執(zhí)行。
圖2 Flex Web應(yīng)用框架圖
2.2 服務(wù)器端 服務(wù)器端可采用分層設(shè)計模式,分為控制層、業(yè)務(wù)層、數(shù)據(jù)層和數(shù)據(jù)實體層等。這里可以采用Spring和Hibernate結(jié)合的方法來進行開發(fā)。
2.3 Flex與服務(wù)端的通信 圖2中的BlazeDS是Adobe公司的一款數(shù)據(jù)服務(wù)產(chǎn)品,它能夠提供高級的與服務(wù)端通信的方式,使Flex通過BlazeDS直接調(diào)用服務(wù)端的Java類,以實現(xiàn)用戶交互層和業(yè)務(wù)邏輯層的無縫連接。
2.4 配置文件 Flex與服務(wù)器端的通信一般需要4個配置文件的支持。在普通Web應(yīng)用中,配置其中的remoting-config.xml(描述遠程調(diào)用Java類的服務(wù)配置文件)和services-config.xml(描述服務(wù)基本設(shè)置的配置文件)這2個文件就可以了。
2.5 部署 Flex應(yīng)用可以運行在任何J2EE服務(wù)器上 ,例 如 Websphere、Weblogic、JRun 以 及 JBoss、Tomcat等服務(wù)器。
“鐵路安全生產(chǎn)日況信息管理系統(tǒng)”(以下簡稱日況系統(tǒng),界面見圖3)是南寧鐵路局2011年下達的科技計劃項目,用于鐵路局安監(jiān)室對安全生產(chǎn)日況信息進行管理。實現(xiàn)了自動讀取鐵路局調(diào)度安全記事原文件,經(jīng)過歸類整理、定性定責(zé)后,生成安全生產(chǎn)日況表、安全生產(chǎn)速報表和安全信息簡報,可按事故、部門、路外、勞安和設(shè)備故障等分類統(tǒng)計。
圖3 日況系統(tǒng)主界面
日況系統(tǒng)設(shè)計采用C/S與B/S結(jié)構(gòu)相結(jié)合的方式。C/S部分實現(xiàn)數(shù)據(jù)的采集、編輯、報表生成和打印等功能。B/S部分基于J2EE架構(gòu),采用Tomcat服務(wù)器,使用oracle9i進行數(shù)據(jù)存儲,通過運行在Tomcat服務(wù)器上的BlazeDS和Java代碼處理系統(tǒng)的查詢和統(tǒng)計邏輯。其中,使用Flex技術(shù)實現(xiàn)了用柱狀圖、餅圖、折線圖等圖表統(tǒng)計數(shù)據(jù)的功能(見圖4所示)。
圖4 圖表統(tǒng)計界面
日況系統(tǒng)生成的電子統(tǒng)計報表都是Excel表格,雖然Excel表格能讓用戶準確地掌握數(shù)據(jù)的具體信息,但表格過多,數(shù)據(jù)量過大,不利于分析數(shù)據(jù)之間的相互關(guān)系和發(fā)展趨勢。用戶也許無法記住一連串的數(shù)字,但是可以很輕松地記住一幅圖畫或者一個曲線。因此,使用圖表統(tǒng)計數(shù)據(jù),會比用Excel電子表格更易于分析和理解。這時候,F(xiàn)lex在日況系統(tǒng)中的發(fā)揮的優(yōu)勢和作用就體現(xiàn)得淋漓盡致。
4.1 Flex在日況系統(tǒng)開發(fā)中的優(yōu)勢 Flex采用基于XML的MXML語言來使用Flex組件,這點與HTML很相似,但MXML有了繼承概念,使得MXML與HTML有著本質(zhì)的不同。與傳統(tǒng)的Web開發(fā)相比,F(xiàn)lex開發(fā)模式不再以請求/響應(yīng)模式作為編程模型。在開發(fā)前臺表現(xiàn)層的傳統(tǒng)HTML組件與Flex組件的比較見表1〔4〕。
表1 傳統(tǒng)HTML組件與Flex組件的比較
通過表1可以看出:Flex組件部署簡單,安全性高,擴展靈活,交互表現(xiàn)豐富,編程容易;程序員可從繁重的前臺界面調(diào)試中得到解脫,節(jié)省了大量寶貴的時間,加快了日況系統(tǒng)Web應(yīng)用的開發(fā)速度;同時Flex使用FlashPlayer作為運行環(huán)境,使客戶交互可以突破瀏覽器的限制。
而與時下流行的JavaScript技術(shù)相比,F(xiàn)lex在系統(tǒng)的實現(xiàn)中也有其特有的優(yōu)勢。雖然JavaScript圖表插件開源,且樣式眾多,但不同樣式和功能的JavaScript圖表插件數(shù)據(jù)源格式可能并不統(tǒng)一。選擇特定樣式和功能的圖表,會面臨選用不同類型的JavaScript插件,這就意味著要把數(shù)據(jù)轉(zhuǎn)換成多種格式。
安全生產(chǎn)日況信息的數(shù)據(jù)繁多復(fù)雜,即要根據(jù)不同類型的數(shù)據(jù)生成多種統(tǒng)計圖表,還要生成同比、環(huán)比的數(shù)據(jù)圖表,并能實現(xiàn)圖表間的切換。如果用JavaScript插件來實現(xiàn),數(shù)據(jù)的轉(zhuǎn)換頗為麻煩,不僅把問題復(fù)雜化,而且JavaScript代碼的調(diào)試也不方便。
使用Flex綁定數(shù)據(jù)就不存在上述問題,只需將數(shù)據(jù)綁定指定成ArrayCollection類型,加到圖表控件中的DataProvider屬性里即可。同時,F(xiàn)lex還可以自定義圖表樣式,像Css一樣指定圖表控件的樣式和各種屬性,如橫縱座標軸的度量,圖表提示Tip的顯示內(nèi)容和格式,圖表的圖示說明,圖表的點擊切換等等,真正做到了圖表的自定義。
4.2 Flex在日況系統(tǒng)中發(fā)揮的作用 用Flex進行圖表設(shè)計,通過MXML文件和Actionscript文件生成的Sw f文件可以在瀏覽器中與用戶進行交互,同時Flash本身的動畫效果也使得頁面不再單調(diào)沉悶。根據(jù)日況統(tǒng)計的需求,設(shè)計條件選項下拉框和選擇按鈕,并觸發(fā)事件生成Flex圖表。這一切都直接在MXML和Actionscript中完成,不再牽扯到其他Jsp文件,實現(xiàn)了模塊化的高度獨立。同時通過Blazeds與后臺的JavaBean交換數(shù)據(jù),在后臺使用Java類從數(shù)據(jù)庫中讀取日況數(shù)據(jù),傳遞給Flex生成圖表。這樣也可以在整體上共用一套Java類,不用再另外編寫后臺方法,減輕了編寫的負擔(dān),同時也降低了代碼的出差程度。對于Flex圖表的整體樣式,可通過同一個Css樣式文件,保持了整體風(fēng)格的統(tǒng)一。
不同圖表間的切換是日況統(tǒng)計圖表設(shè)計的難點,如果不同圖表的數(shù)據(jù)源格式不統(tǒng)一,將要消耗很大的精力和計算機資源進行數(shù)據(jù)轉(zhuǎn)換,正確率也不一定能保證。而Flex實現(xiàn)圖表切換卻非常方便,因為Flex使用同一種數(shù)據(jù)格式,也不存在數(shù)據(jù)轉(zhuǎn)換的麻煩,只需在圖表中觸發(fā)點擊事件,傳遞參數(shù)提取相關(guān)顯示數(shù)據(jù)項,更改圖表狀態(tài)即可。日況系統(tǒng)中用Flex實現(xiàn)了柱狀圖、餅圖、折線圖等統(tǒng)計圖表的功能(見圖5所示)。
圖5 Flex統(tǒng)計圖表
Flex在鐵路安全生產(chǎn)日況信息管理系統(tǒng)中的應(yīng)用,將用戶的從繁瑣復(fù)雜的表格中解脫出來。用Flex實現(xiàn)的統(tǒng)計圖表以更形象、更直觀的方式將數(shù)據(jù)所蘊含的信息和意義展現(xiàn)給用戶,使原來拘泥于Excel電子表格呆板格式的統(tǒng)計和分析工作煥然一新,人機交互性更強,工作效率也更高。
〔1〕Charles E.Brown.The Essential Guide to Flex 3〔M〕.New York,2008.
〔2〕姜天格.Flex3企業(yè)級Web應(yīng)用系統(tǒng)設(shè)計與實現(xiàn)〔M〕.北京:機械工業(yè)出版社,2008.
〔3〕Michele E.Davis,Jon A.Phillips.Flex3:A Beginner’s Guide〔M〕.United States of America,2008.
〔4〕呂曉鵬.精通Flex3.0-基于ActionScript3.0實現(xiàn)〔M〕.北京:人民郵電出版社,2008.