張學勇，韓 曉，李佳陽，孫云楓，鄒金良

(1.南瑞集團公司（國網(wǎng)電力科學研究院），江蘇南京211106；2.國電南瑞科技股份有限公司，江蘇南京211106)

基于可擴展架構(gòu)的SVG圖形系統(tǒng)的設(shè)計與實現(xiàn)

張學勇1，2，韓 曉1，2，李佳陽1，2，孫云楓1，2，鄒金良1，2

(1.南瑞集團公司（國網(wǎng)電力科學研究院），江蘇南京211106；2.國電南瑞科技股份有限公司，江蘇南京211106)

著重闡述了以可縮放矢量圖形(SVG)為核心的可擴展架構(gòu)的WEB圖形的設(shè)計和實現(xiàn)技術(shù)，研究和建立了基于SVG標準的電力系統(tǒng)的圖元庫和統(tǒng)一的SVG圖形發(fā)布格式。研發(fā)應(yīng)用了跨語言接口調(diào)用的技術(shù)和跨語言結(jié)構(gòu)化消息通信機制，研發(fā)應(yīng)用了以服務(wù)器推送技術(shù)實現(xiàn)WEB畫面數(shù)據(jù)異步通信機制?；赟VG和可擴展的WEB圖形系統(tǒng)，有效解決了模型信息動態(tài)刷新時對實時性要求高的問題，提升了WEB圖形應(yīng)用于電網(wǎng)運行控制系統(tǒng)的水平，并在實踐中得到了應(yīng)用。

SVG；可擴展架構(gòu)；跨語言；服務(wù)器推送技術(shù)

電網(wǎng)運行控制系統(tǒng)發(fā)展的目標是保障電網(wǎng)安全穩(wěn)定運行[1]，其中圖形系統(tǒng)是調(diào)度自動化系統(tǒng)的重要組成部分[2]。圖形化顯示作為人機交互的一部分和應(yīng)用系統(tǒng)等集成在一起，但無法直接在WEB上發(fā)布?？煽s放矢量圖形（SVG）的出現(xiàn)為電網(wǎng)控制運行系統(tǒng)的圖形數(shù)據(jù)在WEB上發(fā)布提供了一種開放性的解決方案[3，4]，結(jié)合SVG特點，有效解決了電網(wǎng)圖形在WEB上發(fā)布的問題[5]。

1 SVG圖形建模

1.1 設(shè)備圖元建模

電力系統(tǒng)的圖元設(shè)備在圖形系統(tǒng)中都用一致的圖標表示[7]。根據(jù)SVG的相關(guān)標準，使用預(yù)定義圖元的顯示形狀，即可以完成了圖元與設(shè)備的對應(yīng)。

1.2 SVG圖形建模

引用預(yù)先定義的SVG圖元庫，建立SVG格式的圖形，用SVG的標簽引用圖元庫中定義的標簽的id，圖1展示了WEB圖形上顯示的斷開狀態(tài)的開關(guān)圖元。

圖1 開關(guān)圖元

圖形分平面模式在電網(wǎng)圖形支撐系統(tǒng)中被普遍使用，SVG通過標簽，很好地支持圖形分層，實現(xiàn)多平面嵌套機制[6]。

1.3 自動轉(zhuǎn)換SVG

電網(wǎng)控制系統(tǒng)的圖形描述語言是G語言規(guī)范[7]，是應(yīng)用于電力系統(tǒng)一種新型高效的圖形描述語言[8，9]。瀏覽器無法直接顯示基于G語言描述的圖形文件，需要設(shè)計SVG轉(zhuǎn)換程序，實現(xiàn)從圖形G文件轉(zhuǎn)換成SVG標準格式[10]。

本W(wǎng)EB圖形系統(tǒng)利用當前電力系統(tǒng)中的圖形模塊提供的標準接口獲取到設(shè)備圖元的位置和應(yīng)用屬性，實現(xiàn)了從CIM/G圖形文件到SVG文件的轉(zhuǎn)換，轉(zhuǎn)換流程如圖2所示。

圖2 自動生成SVG流程圖

2 系統(tǒng)結(jié)構(gòu)設(shè)計

本W(wǎng)EB圖形系統(tǒng)基于上述建立的SVG圖形模型，將CIM/G圖形文件轉(zhuǎn)換為SVG標準圖形。圖3給出一個基于SVG的WEB圖形系統(tǒng)的可擴展的設(shè)計方案。

圖3 WEB圖形系統(tǒng)的結(jié)構(gòu)模型

設(shè)計方案分為三層設(shè)計，分為前端層、WEB服務(wù)層和應(yīng)用服務(wù)層。WEB圖形系統(tǒng)的數(shù)據(jù)來自應(yīng)用服務(wù)層，圖形展示數(shù)據(jù)來自于WEB服務(wù)層。本圖形系統(tǒng)在以下方面進行了改進：

（1）實現(xiàn)了WEB服務(wù)器與應(yīng)用服務(wù)器分布式部署的技術(shù)，配置WEB集群和應(yīng)用服務(wù)器集群，在大并發(fā)量訪問情況下，可單獨對WEB服務(wù)器或應(yīng)用服務(wù)器進行擴展。

（2）實現(xiàn)了跨語言接口調(diào)用技術(shù)，在WEB服務(wù)層（Java）直接調(diào)用應(yīng)用層（C++）的接口，直接獲得應(yīng)用層的運行數(shù)據(jù)。

（3）采用了一種跨語言序列化消息通信技術(shù)，實現(xiàn)了在WEB服務(wù)層與應(yīng)用層之間能直接傳輸較復(fù)雜的結(jié)構(gòu)體參數(shù)。

（4）實現(xiàn)了服務(wù)器數(shù)據(jù)推送技術(shù)，WEB服務(wù)層能感知到服務(wù)器上數(shù)據(jù)變化，并把這種變化狀態(tài)主動通知到客戶端。

3 系統(tǒng)實現(xiàn)

3.1 應(yīng)用分離部署技術(shù)

WEB服務(wù)器和應(yīng)用服務(wù)器各作為獨立的集群發(fā)布，WEB服務(wù)器對外提供一個統(tǒng)一的發(fā)布地址，集群內(nèi)部做負載均衡管理。WEB圖形系統(tǒng)的數(shù)據(jù)刷新的流程如圖4所示。首先客戶端發(fā)起數(shù)據(jù)請求，然后WEB服務(wù)層通過資源管理服務(wù)，定位應(yīng)用主機服務(wù)器，最后把獲得的主機服務(wù)器數(shù)據(jù)發(fā)送到客戶端，以后當數(shù)據(jù)有變化時，WEB服務(wù)器會主動把數(shù)據(jù)推送到客戶端。

3.2 跨語言接口調(diào)用技術(shù)

本圖形系統(tǒng)基于JNI（Java Native Interface）框架[11]實現(xiàn)了WEB圖形系統(tǒng)接口與應(yīng)用服務(wù)器數(shù)據(jù)接口的映射，這樣就可以在WEB服務(wù)層直接調(diào)用應(yīng)用層的接口。實現(xiàn)步驟如下：

（1）先定義公共的Java類，定義滿足JNI規(guī)范的公共的Java接口聲明。

圖4 應(yīng)用數(shù)據(jù)獲取流程

（2）用Java平臺提供的生成頭文件命令自動生成目標語言聲明的頭文件。

（3）根據(jù)生成的目標語言的頭文件，定義相應(yīng)的函數(shù)實現(xiàn)體，最終編譯成可以被調(diào)用的目標平臺的動態(tài)庫。

3.3 跨語言結(jié)構(gòu)化通信技術(shù)

為了降低消息通信中的網(wǎng)絡(luò)帶寬和提高消息體解析的簡便性，WEB圖形系統(tǒng)研究采用了ProtocolBuffer作為服務(wù)層之間消息通信的數(shù)據(jù)格式，下面以WEB圖形系統(tǒng)中動態(tài)著色的顏色消息為例介紹跨語言結(jié)構(gòu)化通信技術(shù)的具體實現(xiàn)。

（1）分析并確定著色消息的結(jié)構(gòu)體，結(jié)構(gòu)體中定義了線色、填充色、是否閃爍等信息。消息結(jié)構(gòu)體示意如圖5所示。

圖5 消息結(jié)構(gòu)

（2）用ProtocolBuffer提供的基本類型描述消息結(jié)構(gòu)體，文件描述內(nèi)容如圖6所示。

圖6 Proto結(jié)構(gòu)定義

（3）最后把proto文件編譯成目標語言描述文件。經(jīng)ProtocolBuffer序列化后的二進制信息非常緊湊，消息的體積小，被人截獲后無法被人直接讀取編輯。這種特性應(yīng)用在WEB圖形系統(tǒng)上能防止消息被篡改、被泄露的安全風險，提升了WEB圖形系統(tǒng)的可靠性和安全性[12]。

3.4 數(shù)據(jù)推送技術(shù)

本W(wǎng)EB圖形系統(tǒng)基于Atmosphere框架實現(xiàn)了圖形數(shù)據(jù)推送功能，WEB圖形系統(tǒng)的推送架構(gòu)如圖7所示。

圖7 推送架構(gòu)

主動推送技術(shù)是一種旨在提供富互聯(lián)網(wǎng)應(yīng)用，改善B/S結(jié)構(gòu)應(yīng)用的用戶體驗。

4 WEB圖形在電網(wǎng)控制系統(tǒng)中的應(yīng)用

WEB圖形直觀地顯示出電網(wǎng)運行控制系統(tǒng)的運行狀態(tài)，讓使用者能夠方便快捷地了解當前電網(wǎng)運行控制系統(tǒng)的運行狀態(tài)。當前基于SVG實現(xiàn)的WEB圖形按照預(yù)定義電壓等級的顏色顯示。當根據(jù)拓撲分析結(jié)果時，將帶電的設(shè)備和線路高亮顯示，不帶電的統(tǒng)一顯示一種顏色。當設(shè)備狀態(tài)變化時，WEB圖形會根據(jù)新的拓撲分析顏色重新渲染。SVG支持在輸電線路上疊加箭頭顯示潮流，其中箭頭方向?qū)?yīng)潮流走向，SVG支持動畫能夠使這些箭頭形成流動效果。

廣東中調(diào)OCS系統(tǒng)WEB圖形系統(tǒng)發(fā)布的圖形如圖8所示。

圖8 WEB圖形廠站圖

5 結(jié)束語

本文建立了可擴展的面向電網(wǎng)運行控制系統(tǒng)的WEB圖形架構(gòu)，并應(yīng)用了最新的計算機發(fā)展技術(shù)實現(xiàn)了WEB圖形結(jié)構(gòu)，采取了靈活的平面顯示策略，滿足了多種應(yīng)用的顯示需求。目前該圖形系統(tǒng)已經(jīng)在工程項目中應(yīng)用，完全滿足電力調(diào)度對WEB圖形的多種需求。（1）數(shù)據(jù)報文采用序列化二進制方式傳輸，保證了數(shù)據(jù)的安全性，減小了數(shù)據(jù)傳輸?shù)膸捳加?；?）可擴展的結(jié)構(gòu)方式，可單獨擴充WEB服務(wù)器或應(yīng)用服務(wù)器；（3）數(shù)據(jù)推送技術(shù)實現(xiàn)了數(shù)據(jù)的實時刷新。

[1]姚建國，楊勝春，高宗和.電網(wǎng)調(diào)度自動化系統(tǒng)發(fā)展趨勢展望[J].電力系統(tǒng)自動化，2007，31（13）：7-11.

[2]蔣元晨，潘正玨.電力管理信息系統(tǒng)中圖形的Web發(fā)布[J].電力系統(tǒng)自動化，2003，27（18）：61-64.

[3]郭創(chuàng)新，齊 旭，朱傳柏，等.基于SVG的電力調(diào)度圖形支撐平臺設(shè)計與實現(xiàn)[J].電力系統(tǒng)及其自動化學報，2007，19(2)：28-33.

[4]黃華梅，楊信廷，楊寶祝，等.基于 AJAX和SVG的組態(tài)軟件Web發(fā)布模型[J].計算機工程與設(shè)計，2010，31(11)：2629-2633.

[5]孫 虹，李昆明，王 林，等.基于WEB的省級能效管理平臺的設(shè)計與應(yīng)用[J].江蘇電機工程，2014，33(2)：48-51.

[6]沈劍云，孫利超，劉子英.基于SVG的SCADA圖模庫一體化系統(tǒng)的研究[J].工業(yè)控制計算機，2008，21(12)：27-28.

[7]李 偉，辛耀中，沈國輝，等.基于CIM/G的電網(wǎng)圖形維護與共享方案[J].電力系統(tǒng)自動化，2015，39（1）：42-47.

[8]李亞平，姚建國，黃海峰，等.SVG技術(shù)在電網(wǎng)調(diào)度自動化系統(tǒng)中的應(yīng)用[J].電力系統(tǒng)自動化，2005，29（23）：80-82.

[9]敖麗敏，李林輝.基于AJAX的電力圖形系統(tǒng)的實現(xiàn)[J].電力系統(tǒng)自動化，2007，31（9）：47-81.

[10]何 巖.基于AJAX/SVG的EMS Web監(jiān)視系統(tǒng)的研究[D].成都：西南交通大學碩士研究生學位論文，2005.

[11]米 洪，鄭 穎.基于SOCKET和JNI的Java與C++通信對比研究[J].軟件導(dǎo)刊，2009，08（1）：71-72.

[12]邊 玲，仲學飛.壓縮技術(shù)在實時信息系統(tǒng)中的應(yīng)用[J].電力系統(tǒng)通信，2009，30（198）：41-44.

Design and Implementation of SVG Graphics System Based on Extensible Architecture

ZHANG Xueyong1,2,HAN Xiao1,2,LI Jiayang1,2,SUN Yunfeng1,2,ZOU Jinliang1,2
(1.NARI Group Corporation(State Grid Electric Power Research Institute),Nanjing 211106,China; 2.NARI Technology Development Co.Ltd.,Nanjing 211106,China)

The paper emphatically elaborated the design and implementation technology of WEB graphics based on extensible architecture with SVG(Scalable Vector Graphics)as the core.To realize the technology,power system graphics library and unified SVG graphics publishing format were studied and set up based on the SVG standard.Besides,the R&D applied interface call technology and structured message communication mechanism across different languages.What's more, asynchronous communication mechanism of WEB graphical data was achieved based on server pushing technology.The SVG and scalable WEB graphics system help effectively solve the problem of strict requirement for real-time performance when the model information is dynamically refreshed,improving the level of WEB graphics applied to power grid operation control system.Now the SVG and scalable WEB graphics system has been applied in practice.

SVG;extensible architecture;across different languages;server pushing technology

TM76

A

1009-0665（2016）06-0079-03

張學勇（1983），男，江蘇興化人，工程師，從事電網(wǎng)調(diào)度自動化系統(tǒng)的開發(fā)與研究工作；

韓 曉（1982），男，山東泰安人，工程師，從事電網(wǎng)調(diào)度自動化系統(tǒng)的開發(fā)與研究工作；

李佳陽（1983），女，江蘇連云港人，工程師，從事電網(wǎng)調(diào)度自動化系統(tǒng)的開發(fā)與研究工作；

孫云楓（1974），男，江蘇靖江人，高級工程師，從事電網(wǎng)調(diào)度自動化系統(tǒng)的開發(fā)與研究工作；

鄒金良（1985），男，江蘇鹽城人，工程師，從事電網(wǎng)調(diào)度自動化系統(tǒng)的開發(fā)與研究工作。

2016-08-01；

2016-09-18