基于數(shù)據(jù)大屏的綜合展示系統(tǒng)的開(kāi)發(fā)與設(shè)計(jì)

郭 潔，張 煦，田春思，王京紅，羅 磊

（中國(guó)水利水電科學(xué)研究院，北京 100038）

目前，很多企業(yè)在公司總部或生產(chǎn)控制中心配備了大屏幕設(shè)備，但多數(shù)應(yīng)用限于現(xiàn)有的業(yè)務(wù)系統(tǒng)或視頻圖像投影，內(nèi)容割裂，表現(xiàn)形式單一，不能很好地承擔(dān)對(duì)外宣傳及企業(yè)經(jīng)營(yíng)管理、指揮調(diào)度的職能。

數(shù)據(jù)大屏綜合系統(tǒng)通過(guò)建立覆蓋規(guī)劃、建設(shè)、生產(chǎn)、經(jīng)營(yíng)全要素指標(biāo)體系，匯聚生產(chǎn)實(shí)時(shí)作業(yè)數(shù)據(jù)、視頻監(jiān)控?cái)?shù)據(jù)、統(tǒng)計(jì)分析數(shù)據(jù)、分析預(yù)測(cè)數(shù)據(jù)于一體，以大屏幕和數(shù)據(jù)可視化技術(shù)為載體，用詳實(shí)客觀的數(shù)據(jù)對(duì)企業(yè)建設(shè)、生產(chǎn)、管理的歷史過(guò)程、最新?tīng)顟B(tài)、發(fā)展愿景乃至企業(yè)文化進(jìn)行全景展示。

數(shù)據(jù)可視化的意義在于把相對(duì)復(fù)雜、抽象、離散的數(shù)據(jù)通過(guò)可視的方式展示，使數(shù)據(jù)表達(dá)的意義、數(shù)據(jù)間的關(guān)聯(lián)性更加直觀，能夠更加形象地表達(dá)數(shù)據(jù)的內(nèi)在意義及價(jià)值。

1 系統(tǒng)設(shè)計(jì)

綜合展示系統(tǒng)涉及的數(shù)據(jù)來(lái)源眾多，生產(chǎn)廠家紛繁蕪雜，為了解決這一問(wèn)題，本系統(tǒng)采用了面向服務(wù)體系架構(gòu)（SOA）作為解決方案。主要實(shí)現(xiàn)方法是為各個(gè)數(shù)據(jù)源提供統(tǒng)一的Web Service接口獲取數(shù)據(jù)，接收指令。

綜合展示系統(tǒng)能夠?qū)崿F(xiàn)指標(biāo)統(tǒng)一管理，畫(huà)面靈活拼接、交互，數(shù)據(jù)采集穩(wěn)定、可靠，需要多個(gè)子系統(tǒng)協(xié)同合作，共同實(shí)現(xiàn)。

圖1 綜合展示系統(tǒng)總體設(shè)計(jì)圖

大屏展示系統(tǒng)采用面向服務(wù)體系架構(gòu)，采用MySql數(shù)據(jù)庫(kù)作為數(shù)據(jù)底層；在應(yīng)用管理層中對(duì)采集到的數(shù)據(jù)進(jìn)行計(jì)算、統(tǒng)計(jì)、清洗等二次加工，基礎(chǔ)服務(wù)使用IIS發(fā)布WebService提供對(duì)數(shù)據(jù)的維護(hù)及查詢,應(yīng)用服務(wù)層同時(shí)支持采用.net framework、Python、Java等其它語(yǔ)言開(kāi)發(fā)業(yè)務(wù)分析模塊，并調(diào)用各個(gè)模塊的分析結(jié)果對(duì)可視化展示提供數(shù)據(jù)支撐；控制層采用JavaEE實(shí)現(xiàn)，使用Tomcat或其它支持WebSocket的容器運(yùn)行,采用基于Chrome瀏覽器內(nèi)核的Electron軟件實(shí)現(xiàn)控制層與展示頁(yè)面的交互，并提供WebService對(duì)展示方案進(jìn)行定制。頁(yè)面展示層采用.Net framework框架為展示頁(yè)面提供http接口的數(shù)據(jù)api，以滿足展示要求，并提供頁(yè)面拼接服務(wù)對(duì)子頁(yè)面進(jìn)行組合。

圖2 綜合展示系統(tǒng)總體設(shè)計(jì)圖

2 數(shù)據(jù)支撐

2.1 數(shù)據(jù)采集

系統(tǒng)的數(shù)據(jù)源支持Oracle、MySql、達(dá)夢(mèng)等關(guān)系型數(shù)據(jù)庫(kù)。接入的數(shù)據(jù)類型包括：接入定期更新的靜態(tài)數(shù)據(jù)：表格(報(bào)表等)、文本（報(bào)告、宣傳稿等）、圖片和視頻（宣傳、新聞等）；接入實(shí)時(shí)視頻流：生產(chǎn)監(jiān)控實(shí)施監(jiān)控視頻、自動(dòng)化生產(chǎn)模擬視頻等。

為系統(tǒng)設(shè)計(jì)的數(shù)據(jù)采集子模塊可從多個(gè)數(shù)據(jù)源、系統(tǒng)中進(jìn)行數(shù)據(jù)采集，自動(dòng)監(jiān)控管理數(shù)據(jù)源進(jìn)程的運(yùn)行狀態(tài)，并對(duì)處于異常狀態(tài)中的進(jìn)程進(jìn)行復(fù)位操作，使其能重新工作，同時(shí)生成系統(tǒng)日志。

2.2 數(shù)據(jù)管理平臺(tái)

數(shù)據(jù)管理平臺(tái)是綜合服務(wù)模塊的基礎(chǔ)平臺(tái)，主要為系統(tǒng)管理員、維護(hù)人員提供原始數(shù)據(jù)配置及增改刪查，提供人工填報(bào)數(shù)據(jù)的界面，數(shù)據(jù)分享的配置等等操作的系統(tǒng)。

數(shù)據(jù)管理平臺(tái)的主要功能如下：

（1）提供數(shù)據(jù)的緩存，當(dāng)數(shù)據(jù)源不能連接時(shí)，可展示在連接中斷前的數(shù)據(jù)；

（2）對(duì)指標(biāo)進(jìn)行統(tǒng)一管理，降低維護(hù)難度，提高維護(hù)效率；

（3）對(duì)本地?cái)?shù)據(jù)進(jìn)行統(tǒng)計(jì)分析等二次加工形成新的指標(biāo)；

（4）存儲(chǔ)指標(biāo)歷史數(shù)據(jù)，對(duì)歷史數(shù)據(jù)進(jìn)行統(tǒng)計(jì)分析；

（5）人工填報(bào)數(shù)據(jù)，提供錄入、審核手段；

（6）可配置指標(biāo)的抽取邏輯；

（7）支持四則運(yùn)算，積分運(yùn)算，Sql語(yǔ)句的用戶自定義。

（8）定義數(shù)據(jù)源的數(shù)據(jù)采集周期或數(shù)據(jù)綜合計(jì)算周期；

（9）對(duì)數(shù)據(jù)質(zhì)量進(jìn)行管理，當(dāng)出現(xiàn)明顯不合理數(shù)據(jù)，阻止對(duì)該數(shù)據(jù)進(jìn)行展示；

（10）對(duì)數(shù)據(jù)的合理性進(jìn)行約束，支持范圍超限、數(shù)據(jù)跳變、持續(xù)增長(zhǎng)等約束條件定義。

（11）定義指標(biāo)的更新周期，當(dāng)超出更新周期數(shù)據(jù)未更新可提示用戶；

（12）對(duì)外提供基于WebService的開(kāi)放接口，可訪問(wèn)數(shù)據(jù)平臺(tái)中的任何數(shù)據(jù)。

3 可視化實(shí)現(xiàn)

展示系統(tǒng)的組成單元是展示頁(yè)面，系統(tǒng)設(shè)計(jì)基于Web方式的展示頁(yè)面，采用Web框架可在很多經(jīng)典穩(wěn)定框架基礎(chǔ)上進(jìn)行開(kāi)發(fā)設(shè)計(jì)、異步數(shù)據(jù)獲取機(jī)制可保障頁(yè)面展示效果流暢無(wú)卡頓。使用基于Web框架的圖表、表單、3D組件等多種表現(xiàn)形式，達(dá)到展示頁(yè)面美觀大方，內(nèi)容準(zhǔn)確、形象、重點(diǎn)突出等效果。

頁(yè)面的實(shí)現(xiàn)過(guò)程主要由需求分析、原型設(shè)計(jì)、素材收集、精細(xì)化設(shè)計(jì)、頁(yè)面集成幾個(gè)環(huán)節(jié)組成。

3.1 需求分析

需求分析是頁(yè)面實(shí)現(xiàn)工作中的第一步，也是最重要的一環(huán)。一般在與業(yè)務(wù)部門(mén)進(jìn)行充分溝通后明確展示的主題、對(duì)于展示主題進(jìn)行核心詞提煉，圍繞著核心詞分析各重要指標(biāo)間的關(guān)聯(lián)性以及提取其位于行業(yè)的重要性。在需求分析的過(guò)程中，將分析結(jié)果快速形成白板設(shè)計(jì)稿，白板設(shè)計(jì)稿不涉及過(guò)細(xì)的展示效果，僅對(duì)指標(biāo)進(jìn)行排放。白板設(shè)計(jì)稿的意義在于多次討論迭代的過(guò)程中可對(duì)展示主題有內(nèi)容上的概念，展示內(nèi)容的飽滿性，指標(biāo)之間的關(guān)聯(lián)性、以及對(duì)主題的支撐度有相對(duì)直觀的效果。

3.2 原型設(shè)計(jì)

原型設(shè)計(jì)即將白板設(shè)計(jì)稿中的指標(biāo)元素以文字、數(shù)據(jù)、曲線、棒圖、餅圖、或3D圖元等方式展示出來(lái)，并對(duì)頁(yè)面文字、背景色、前景色進(jìn)行初步選擇。原型設(shè)計(jì)的意義在于明達(dá)各指標(biāo)的展示形式，以及頁(yè)面布局是否合理，并能快速形成簡(jiǎn)單的展示效果與業(yè)務(wù)人員進(jìn)行溝通。

3.3 素材收集

素材收集針對(duì)與頁(yè)面涉及到的具體文字、圖片、視頻、模型、數(shù)據(jù)等素材進(jìn)行收集整理，收集過(guò)程涉及到與具體業(yè)務(wù)部門(mén)人員溝通、對(duì)收集到的素材進(jìn)行整理加工的過(guò)程。數(shù)據(jù)的收集如涉及到動(dòng)態(tài)數(shù)據(jù)還需要了解數(shù)據(jù)來(lái)源類型、數(shù)據(jù)結(jié)構(gòu)、數(shù)據(jù)更新周期等信息。數(shù)據(jù)采集根據(jù)各業(yè)務(wù)系統(tǒng)數(shù)據(jù)組成形式的不同，配置或定制開(kāi)發(fā)不同的數(shù)據(jù)采集程序。對(duì)于有數(shù)據(jù)庫(kù)、網(wǎng)站、日?qǐng)?bào)等數(shù)據(jù)源的業(yè)務(wù)指標(biāo)盡量采取自動(dòng)采集數(shù)據(jù)的方式，以提高數(shù)據(jù)的準(zhǔn)確性及降低系統(tǒng)維護(hù)工作，對(duì)于無(wú)法自動(dòng)采集數(shù)據(jù)的指標(biāo)可采用人工錄入數(shù)據(jù)的方式達(dá)到展示的效果。

3.4 精細(xì)化設(shè)計(jì)

精細(xì)化設(shè)計(jì)即對(duì)原型圖進(jìn)行精細(xì)雕琢、美術(shù)設(shè)計(jì)，展現(xiàn)最終的靜態(tài)效果圖，精細(xì)化設(shè)計(jì)確定稿與頁(yè)面最終效果保持一致。值得注意的是，在精細(xì)化設(shè)計(jì)的過(guò)程中，圖表、3D模型的設(shè)計(jì)要充分考慮后續(xù)實(shí)現(xiàn)的可行性，不做無(wú)法實(shí)現(xiàn)的設(shè)計(jì)。數(shù)據(jù)、圖表盡量采用真實(shí)數(shù)據(jù)，由于數(shù)據(jù)量級(jí)可能直接影響最終展示效果，在精細(xì)化設(shè)計(jì)階段、盡量采用真實(shí)數(shù)據(jù)做為設(shè)計(jì)數(shù)據(jù)可最大程度地保證最終展示效果的還原程度。

3.5 頁(yè)面實(shí)現(xiàn)

通過(guò)代碼實(shí)現(xiàn)Web展示頁(yè)面，根據(jù)精細(xì)化設(shè)計(jì)稿對(duì)頁(yè)面進(jìn)行高度還原，將設(shè)計(jì)稿中的文字、數(shù)據(jù)、曲線、棒圖、餅圖、或3D圖元封裝成組件，針對(duì)頁(yè)面所需數(shù)據(jù)定制開(kāi)發(fā)api服務(wù)，對(duì)頁(yè)面內(nèi)組件進(jìn)行周期數(shù)據(jù)更新，以達(dá)到最終展示效果。

4 導(dǎo)航控制

為實(shí)現(xiàn)最優(yōu)的展現(xiàn)效果，應(yīng)盡量縮短展現(xiàn)主題的切換時(shí)間，并能編制展示預(yù)案以應(yīng)對(duì)不同受眾的觀看需求。為此，系統(tǒng)設(shè)計(jì)開(kāi)發(fā)的導(dǎo)航工具，與大屏的矩陣切換設(shè)備或中控設(shè)備緊密結(jié)合，實(shí)現(xiàn)主題索引、預(yù)覽、展示方案編制、主題/子題無(wú)縫切換等功能，并支持PAD導(dǎo)航控制、激光筆翻頁(yè)等手段。

4.1 軟件框架

導(dǎo)航軟件采用B/S架構(gòu)，由服務(wù)端、控制端、展示端3部分組成。導(dǎo)航軟件數(shù)據(jù)流向如圖3所示。

圖3 導(dǎo)航系統(tǒng)數(shù)據(jù)流向圖

4.2 服務(wù)端

采用JavaEE實(shí)現(xiàn)，使用Tomcat或其它支持WebSocket的容器運(yùn)行。服務(wù)端軟件部署在展示工作站，提供功能如下：

（1）為控制端頁(yè)面提供Web服務(wù)；

（2）接收控制端切換頁(yè)面指令，發(fā)送指令至展示端切換頁(yè)面，發(fā)送指令至大屏CMS服務(wù)器，切換布局；

（3）多服務(wù)端熱備，為消除單點(diǎn)故障，可設(shè)置多臺(tái)主機(jī)運(yùn)行服務(wù)端軟件。

4.3 控制端

使用瀏覽器界面，采用WebSocket與服務(wù)端通信傳送控制指令，并接收頁(yè)面狀態(tài)?？刂贫塑浖蛇\(yùn)行于任意與服務(wù)端同一網(wǎng)絡(luò)的Pad或者PC，提供以下功能：

（1）展示工作站配置，方案編制；

（2）切換方案、頁(yè)面、子頁(yè)面、語(yǔ)言；

（3）顯示展示端狀態(tài)；

（4）預(yù)覽頁(yè)面等。

4.4 展示端

采用基于Chrome瀏覽器內(nèi)核的Electron軟件，打開(kāi)/切換展示頁(yè)面，展示端軟件部署于展示工作站，提供以下功能：

（1）接收控制端指令，打開(kāi)多個(gè)頁(yè)面，并控制其最大化/最小化/全屏/隱藏等；

（2）接收控制端指令，切換子頁(yè)面、語(yǔ)言以及執(zhí)行其它動(dòng)作指令；

（3）窗口截屏，并發(fā)送到服務(wù)器端；

（4）與服務(wù)端連接發(fā)生異常時(shí)，立即重連；

（5）管理所有窗口狀態(tài)，并每秒向服務(wù)器報(bào)送一次狀態(tài)；

（6）使用JSON格式的命令描述與服務(wù)器通信。

5 結(jié)束語(yǔ)

在移動(dòng)互聯(lián)大背景下，企業(yè)的信息化腳步從信息化企業(yè)階段邁向了數(shù)字化企業(yè)，以“大數(shù)據(jù)”、“可視化”為支撐的綜合展示系統(tǒng)已經(jīng)逐漸成為一種普遍的趨勢(shì)。

通過(guò)在三峽集團(tuán)公司、北方工業(yè)集團(tuán)公司、國(guó)家電力投資集團(tuán)有限公司等企業(yè)的應(yīng)用，將生產(chǎn)數(shù)據(jù)與大屏可視化關(guān)聯(lián)起來(lái)，在提升企業(yè)形象的同時(shí)，對(duì)生產(chǎn)及建設(shè)過(guò)程從宏觀到微觀，從整體到局部的實(shí)時(shí)監(jiān)視，數(shù)據(jù)大屏也將成為企業(yè)決策、指揮的重要平臺(tái)。