VML/SVG開發配電站接線系統

近幾年來,隨着Internet的迅猛發展,網頁技術突飛猛進,人們都試圖設計出精美、有特點的頁面。其中,圖形技術發揮着相當重要的做用,可升級矢量圖像( SVG, Scalable Vector Graphics)和VML (Vector Markup Language)的產生有着十分積極的意義。它具備支持矢量圖和動畫、由文本構成圖形易於操做、對點陣圖形兼容等特色。然而，不一樣瀏覽器對兩種標準的支持並不一致， 微軟的IE瀏覽器系列對VML支持比較好，而其餘的瀏覽器軟件對SVG標準支持更完美。這也使得開發基於Web的圖形系統變得更加複雜。多比圖形控件出現簡化了的這種開發難度，它是一款基於Web的矢量圖形控件，可以檢測瀏覽器類型，自動選擇VML或SVG方案進行作圖， 相似於網頁上的Visio控件。

針對電力系統的須要,可將多比中間件技術用於配電站接線圖的繪製及發佈。多比編輯工具在提供友好界面的同時,提供了大量配電站元件圖元,能夠輕鬆、直觀、方便、快捷地完成配電站接線圖的製做。

 

1 多比控件技術概述

1. 1 VML技術

VML (VectorMarkup Language)是XML1. 0 的一個應用,使用VML 能夠在IE 5. 0 以上版本中繪製矢量圖形。因爲VML 是基於新一帶網絡標記語言XML 標準的,也就是說,表示方法簡單,易於擴展,數據與表現相分離,同時VML 支持高質量的矢量圖形顯示,它基於相鏈接的直線和曲線描述路徑。其次VML 由文本構成,能夠很方便地融合到HTML文件中,可用不多的字節來表示較複雜的圖像,能夠和其它HTML元素同樣使用VML元素,在客戶端瀏覽器顯示圖像。VML可使用DHTML大部分屬性和事件,如id, onmouseover等。最後VML 的功能不僅是繪圖,它能夠在圖形中嵌入文本,並可實現超鏈,經過腳本控制還能夠實現動畫效果。

1. 2 SVG技術

SVG是由W3C制定的基於XML來描述二維矢量圖型的一個開放標準,它用文本格式的描述性語言來描述圖像內容,所以是一種和圖像分辨率無關的矢量圖形格式。它具備如下優勢:

1.圖像文件可讀,易於修改和編輯。

2.與現有技術能夠互動融合。另外, SVG文件還可嵌入JavaScript腳原本控制SVG對象。

3.SVG圖形格式能夠用來動態生成圖形。例如,可用SVG動態生成具備交互功能的地圖,嵌入網頁中,並顯示給終端用戶。

4. 如前所述, SVG文檔做爲一種規範的XML文檔,可以很好地與W3C其餘開放標準如DOM, CSS,XSL, XL ink, Xpointer, SM IL, HTML, XHTML等進行協同工做,簡化異質系統間的信息交流,方便數據庫的存取。

 

 

 

多比圖形控件出現簡化了的這種開發難度，它是一款基於Web的矢量圖形控件，可以檢測瀏覽器類型，自動選擇VML或SVG方案進行作圖， 相似於網頁上的Visio控件，是目前國內外最佳的基於web矢量圖解決方案，能夠用於電力、化工、煤炭、工控組態軟件、仿真、地理信息系統、工做流、複雜報表 工業SCADA系統、ERP流程設計系統、圖形管理、圖形拓撲分析、GIS地理信息系統系統、工程製圖等領域。

多比圖形編輯器實現了圖形、圖像和文字的有機統一。它除了支持HTML 中經常使用的標記,如文本、圖像、連接、交互性、CSS的使用、腳本( Scrip t)外,還提供了大量針對圖形、圖像、動畫的特定標記。對SVG圖形文件進行編輯管理的過程爲: SVG圖形文件經XML 解析器打開,並在內存中生成一個對象樹,用鼠標事件來驅動腳本執行,腳本經過DOM接口對對象進行相關的操做,來實現圖形繪製、編輯等功能。

 

 

2.在配電站接線圖中的應用

配電站接線圖是一種特定的複雜而又有規則的圖形,能夠採用SVG技術繪製配電站接線圖。它基本由一些固定的電氣元件組成(或稱爲圖元) ,這些圖元有其固定的表現形式。該SVG編輯工具不只提供了一個界面友好、方便使用的編輯環境,並且能夠提供大量配電站電氣元件圖元,這樣能夠實現SVG文件格式存儲,輕鬆完成配電站接線圖的製做。

    傳統的ActiveX控件實現的方式有許多缺點：客戶端的部署很困難，如客戶端不能正確下載，下載了之後不能正確執行，下載的時候須要設置IE的安全級別等等.

 

3 實現圖形編輯功能與操做

SVG圖形編輯系統應用在電力系統接線圖的繪製時,除了最基本的繪製與編輯功能外,還須要考慮到電力系統繪圖的實際須要,設置不一樣的功能實現接線圖更方便的繪製,如不一樣型號的電力線的選擇、基本圖元的選取等。對於不一樣型號的電力線選取,以粗度爲0. 5 cm

線條的繪製爲例,以示意方式區別普通的黑色線條。

 

圖中,工具欄Design中變壓器圖案,表示點擊後對變壓器圖元的繪製。點擊圖元后,矩形框變爲紅色表示選中,由圖元可繪製出變壓器的圖形元件。編輯系統能夠實現對元件圖元進行適當的修改,如放大、縮小、平移、刪除等。

以平移爲例,對SVG圖形編輯系統的功能和操做進行簡單說明。

點擊工具欄Tools中的箭頭圖案,矩形框變爲紅色,表示選中平移功能;按住鼠標左鍵,拖拽鼠標.