基于SVG的電網拓撲可視化研究

管亞安 宋海龍 王海東 李軍海

摘 要：可視化技術可以幫助運行人員在最短時間內直觀準確的掌握電力系統中最關鍵、最核心的問題。本文主要介紹了SVG的技術特點和SVG在電力系統軟件圖形化應用中的基本方法，并重點闡述了基于SVG的電網拓撲可視化技術在電力系統中的應用。

關鍵詞：可視化，SVG，電網，圖形化

引 言

SVG 依靠自身的優勢成為新一代的圖形交互標準，可被多種工具讀寫和修改，與傳統圖像格式相比尺寸更小、可壓縮性更強，可在多種分辨率下高質量打印。SVG圖像中的文本是可選的、可搜索的，是開放的標準，不需要額外的程序來處理，非常利于在網上發布，提升了電力系統的可視化程度。目前很多電力系統應用軟件或者仿真軟件可以做到對電力系統可視化圖形的顯示和支持，但是這些系統采用各自不同的實現技術和方法，不同系統之間的圖形和數據共享困難，并且對于不同的操作平臺系統的移植和兼容性較差，本文主要介紹了SVG的技術特點和SVG在電力系統軟件圖形化應用中的基本方法，闡述了SVG在電力系統中的具體應用。

1、電力圖元的SVG 描述

1.1、電力系統中的SVG 圖元的要求

電力系統中的圖形是由大量的圖元（Element）構成的，因此，將圖元進行SVG的描述是標準化圖形的基礎。完備的圖元描述要求有：對圖元幾何形狀的完整表述;利于定義圖元的應用屬性及擴充;利于定義圖元與外界交互功能;能夠對圖元的幾何形狀和應用屬性進行存取和顯示。

1.2 、電力SVG 圖元的具體描述

1.2.1、幾何信息

幾何信息是基本圖形的概述，應包含圖形類型，坐標位置和坐標單元。SVG提供了六種基本元素，在SVG文檔中，圖元的幾何形狀定義部分一般由元素構成，可以在元素中定義包含于這個元素中的樣式風格、信息等特性。

1.2.2、交互事件

交互事件應包括事件名和響應函數的描述，在SVG中還定義了大量的標準事件支持圖元與腳本語言的交互功能，交互事件的定義只需要定義一個事件響應函數，并建立它與圖元的事件名之間的映射關系。

1.2.3 、Ajax與SVG的結合

Ajax與SVG圖形可以很有效的結合，并通過Web發布圖形。其步驟是：首先執行Javascript事件觸發，用戶操作Web頁面中的SVG圖形的某個控件或文字鏈接，觸發一個Javascript事件;然后Javascript事件處理函數執行，并根據情況向服務器發送電力設備數據或信息的查詢要求，將用戶請求提交給服務器;服務器接收用戶請求后，根據URL地址判斷并響應用戶行為，并將相應結果以HTMUXHTML格式返回;Javascript調用DOM處理解析的數據，將解析出來的電網數據寫入到SVG圖形的相應節點中，從而更新界面。

2、電力SVG圖形 文件的設計實現

2.1、電力SVG 文件的設計

電力SVG文檔是基于XML的，或者說SVG本身就是XML，所以對于XML文檔的管理和操作的方法對SVG 文檔而言是普遍適用的。在XML 文檔的解析中，有兩種主要的方法：文檔對象模型接口（DOM）和XML 簡易應用程序編程接口（SAX）。我們采用Notepad++和Inkscape 作為開發的平臺，并用IE瀏覽器作為測試的平臺，用DOM接口分別對電力中的SVG 文件實現管理和操作，然后結合傳統的索引結構，以DOM 作為解析器，對電力大體積的SVG 文件管理建立了索引結構，并且給出具體的實現的方法和結果。

2.2、圖層的定義

對SVG文件本身而言，并沒有圖層元素，但是由于SVG采用DOM的管理結構，因此實現圖層的管理很方便。在電力SVG文件中，我們一般采用元素對圖層進行定義。這樣我們在進行電力系統圖形的交互的時候，就可以把各類電力設備圖元按照CIM模型進行層次管理，在每一層下面放一類設備，這樣既可以增強整個文件的直觀性，也可以方便的實現設備的屬性、以及對設備元件進行選中、刪除等操作。

2.3、樣式

在電力系統中有很多標準字體和顏色，例如不同電壓等級的設備顯示顏色是不同的，所以在公共部分定義一些公共字體和顏色是非常有好處的，SVG中幾乎所有的可視化元素可以使用“Style”屬性，“Style”屬性的值是在CSS樣式定義的字符串，樣式項使用“樣式參數值”的形式表示，各項之間使用分好隔開。“style”屬性作為被說明元素的一個屬性而存在，其屬性值（即參數的內容）說明了本元素應該怎樣被渲染。“style”的參數多種多樣，幾乎涵蓋了從文字到圖形、從色彩到濾鏡等各個方面。

對于SVG內嵌的CSS語句，需要通過在元素中定義