1、SVG/WEB介紹,SVG基本概念,SVG(Scable Vector Graphics，可升級(jí)矢量圖像)是一種基于XML的開(kāi)放的矢量圖形描述語(yǔ)言。 SVG圖像是與XML1.0兼容的文檔，SVG元素是指示如何繪制圖像的一些指令，閱讀器(SVGViewer)解釋這些指令，把SVG圖像在指定設(shè)備上顯示出來(lái)。(IE7后自動(dòng)內(nèi)嵌) 使用SVG可以在網(wǎng)頁(yè)上顯示出各種各樣的高質(zhì)量的矢量圖形，支持很多您想象得出的功能：幾何圖形、動(dòng)畫(huà)、漸變色、濾鏡效果等。 SVG是完全用普通文本來(lái)描述的！也就是說(shuō)，這是一種專門為網(wǎng)絡(luò)而設(shè)計(jì)的基于文本的圖像格式。,SVG特點(diǎn),基于XML標(biāo)準(zhǔn)XML是公認(rèn)的下一代網(wǎng)絡(luò)標(biāo)記語(yǔ)言，擁有

2、無(wú)窮的生命力。 高質(zhì)量的圖像由于基于矢量，使得SVG圖像的質(zhì)量得到大大的提高。 靈活易用的文件格式SVG可以不用任何圖像處理工具，僅僅用記事本就可以生成一個(gè)SVG圖像！ 支持交互和動(dòng)畫(huà) 支持字符查找查找“圖片”中的字符，在SVG中成為可能。 支持Xlink 和Xpointer這意味著我們可以在SVG文檔之間制作超鏈接，這使我們可以制作一個(gè)完全由SVG構(gòu)成的WEB站點(diǎn)。,SVG基本形狀,（circle）：顯示一個(gè)圓心在指定點(diǎn)、半徑為指定長(zhǎng)度的標(biāo)準(zhǔn)的圓。 橢圓（ellipse）：顯示中心在指定點(diǎn)、長(zhǎng)軸和短軸半徑為指定長(zhǎng)度的橢圓。 矩形（rect）：顯示左上角在指定點(diǎn)并且高度和寬度為指定值的矩形（包

3、括正方形）。也可以通過(guò)指定邊角圓的 x 和 y 半徑畫(huà)成圓角矩形。 線（line）：顯示兩個(gè)坐標(biāo)之間的連線。 折線（polyline）：顯示頂點(diǎn)在指定點(diǎn)的一組線。 多邊形（polygon）：類似于 polyline，但增加了從最末點(diǎn)到第一點(diǎn)的連線，從而創(chuàng)建了一個(gè)閉合形狀。,SVG簡(jiǎn)單樣例, ,SVG效果,電力系統(tǒng)中SVG應(yīng)用,電力系統(tǒng)是一個(gè)典型的拓?fù)浣Y(jié)構(gòu)網(wǎng)絡(luò)，作為調(diào)度自動(dòng)化研究對(duì)象的電力系統(tǒng)模型包括如下方面： 設(shè)備基本參數(shù)，包括物理屬性、運(yùn)行屬性等 設(shè)備之間的連接關(guān)系，即通常所說(shuō)的物理拓?fù)浣Y(jié)構(gòu) 量測(cè)量參數(shù),SVG能夠繪制實(shí)際的電網(wǎng)拓?fù)浣Y(jié)構(gòu)圖形,圖形中形象展示電力系統(tǒng)中各設(shè)備及其參數(shù)、設(shè)備間的物

4、理拓?fù)?、量測(cè)量等參數(shù),并作為標(biāo)準(zhǔn)的圖形格式進(jìn)行交換,繪圖,+,設(shè)備基本 參數(shù)編輯,=,電網(wǎng)模型,電網(wǎng)圖形,圖模一體化技術(shù)，通過(guò)繪制實(shí)際的電網(wǎng)拓?fù)浣Y(jié)構(gòu)圖形，將自動(dòng)生成了電網(wǎng)的拓?fù)浣Y(jié)構(gòu)參數(shù)并入庫(kù)，并可進(jìn)行拓?fù)浣Y(jié)構(gòu)的合理性檢查，同時(shí)，在圖形上編輯的設(shè)備參數(shù)可以直接入庫(kù)。,圖模交換,場(chǎng)景1,場(chǎng)景2,模型與圖形,模型與圖形,模型與圖形,模型與圖形,模型與圖形,模型與圖形,地調(diào),省調(diào),省調(diào),地調(diào)1,地調(diào)2,地調(diào)3,地調(diào)4,地調(diào)n,模型拼接,模型與圖形,模型與圖形,模型與圖形,模型與圖形,模型與圖形,模型與圖形,全模型與圖形,SVG/CIM (圖形與模型),CIM是按照面向?qū)ο蠼⑵饋?lái)的電力系統(tǒng)對(duì)象模型，它

5、定義了用于電力系統(tǒng)模型中各類對(duì)象的名稱和屬性。CIM不是數(shù)據(jù)庫(kù)，它指導(dǎo)調(diào)度自動(dòng)化系統(tǒng)建庫(kù)和系統(tǒng)之間電網(wǎng)模型交換。, LangL_S.500.1_T 500kv/380kv/220kv LangL_S.220.1_T.WH 550側(cè)線圈 , ,SVG與CIM(圖形與模型),Id關(guān)聯(lián)： 對(duì)于某一電力設(shè)備的圖形（svg中對(duì)象）和模型（cim對(duì)象）采用相同的ID或者采用一定關(guān)聯(lián)關(guān)系的ID，實(shí)現(xiàn)應(yīng)用程序?qū)D形和模型進(jìn)行各種操作，實(shí)現(xiàn)圖模一體。 Metadata（元數(shù)據(jù)）關(guān)聯(lián)，SVG規(guī)范提供元素用來(lái)描述其他SVG元素屬性。 ,SVG圖形,國(guó)網(wǎng)公司在IEC61970-453 CIM Based Graphi

6、cs Exchange的基礎(chǔ)之上制定了基于SVG的公共圖形交換格式,SVG圖形,廠站單線圖,系統(tǒng)圖,標(biāo)準(zhǔn)規(guī)定了基于SVG的EMS/SCADA系統(tǒng)間的系統(tǒng)圖和一次接線圖的圖形交互規(guī)則及EMS/SCADA系統(tǒng)與GIS系統(tǒng)等其他應(yīng)用系統(tǒng)的圖形交互規(guī)則。目的是實(shí)現(xiàn)不同系統(tǒng)、不同廠家和不同電力企業(yè)間的圖形交換。,SVG應(yīng)用,拓樸圖形展示（放大、縮小、拖放等） 實(shí)時(shí)數(shù)據(jù)展示 參數(shù)、歷史數(shù)據(jù)展示 曲線、棒圖、餅圖 圖形交換,WEB框架總圖,WEB基本概念,WEB開(kāi)發(fā)主流平臺(tái),.NET(Micro Software) J2EE (SUN),.NET vs J2EE,J2EE簡(jiǎn)介,（Java 2 Platfor

7、m,Enterprise Edition） J2EE是一套全然不同于傳統(tǒng)應(yīng)用開(kāi)發(fā)的技術(shù)架構(gòu)，包含許多組件，主要可簡(jiǎn)化且規(guī)范應(yīng)用系統(tǒng)的開(kāi)發(fā)與部署，進(jìn)而提高可移植性、安全與再用價(jià)值。 J2EE核心是一組技術(shù)規(guī)范與指南，其中所包含的各類組件、服務(wù)架構(gòu)及技術(shù)層次，均有共通的標(biāo)準(zhǔn)及規(guī)格，讓各種依循J2EE架構(gòu)的不同平臺(tái)之間，存在良好的兼容性，解決過(guò)去企業(yè)后端使用的信息產(chǎn)品彼此之間無(wú)法兼容，導(dǎo)致企業(yè)內(nèi)部或外部難以互通的窘境。 J2EE是一組框架，提供各種服務(wù)及API，如servlet、jsp、jdbc、ejb、jms、rmi、jndi、jta、jca、jaas、jacc、jax-rpc、jaxr,WEB開(kāi)

8、發(fā)相關(guān)框架及技術(shù),Struts Spring Hibernate Ajax Ext Dwr Corba/web service Javascript css,Struts,Struts是基于SUN J2EE標(biāo)準(zhǔn)的MVC框架,主要通過(guò)servlet和jsp技術(shù)實(shí)現(xiàn).其 通過(guò)將servlet、jsp、自定義標(biāo)簽、信息資源融合至一起,形成一個(gè)通用的框架實(shí)現(xiàn)MVC模式. Struts為業(yè)務(wù)邏輯開(kāi)發(fā)提供支持,作為MVC模式實(shí)現(xiàn),其中M主要由Action實(shí)現(xiàn),V主要指標(biāo)簽庫(kù)與servlet結(jié)合實(shí)現(xiàn),C主要由Servlet及XML資源實(shí)現(xiàn).,Struts 體系結(jié)構(gòu),Spring,Spring 是一種開(kāi)源框架

9、，主要應(yīng)用于“without EJB”的J2EE輕量級(jí)軟件開(kāi)發(fā)。 Spring 存在兩個(gè)核心方面：IOC（控制反轉(zhuǎn)，或稱DI，依賴注射）和AOP（面向切面的編程）。 Spring 采用分層架構(gòu)，所有模塊構(gòu)建在核心容器上，核心容器定義了創(chuàng)建、配置和管理bean的方式。,Spring IOC,不創(chuàng)建對(duì)象，但是提供描述創(chuàng)建它們的方式。在代碼中不直接與對(duì)象和服務(wù)連接，但在配置文件中描述哪一個(gè)組件需要哪一項(xiàng)服務(wù) Dont call me ,Ill call you!,Spring AOP,動(dòng)態(tài)代理模式 Advice,Advisor,Pointcut,Hibernate,Hibernate是Java平臺(tái)上

10、一個(gè)功能全面的、開(kāi)源的OR映射框架。Hibernate支持開(kāi)發(fā)符合常規(guī)Java理念的持久性類 包括關(guān)聯(lián)、繼承、多態(tài)、復(fù)合以及 Java 集合框架。Hibernate 查詢語(yǔ)言（HQL）被設(shè)計(jì)成 SQL 的一個(gè)微型面向?qū)ο髷U(kuò)展，它是對(duì)象和關(guān)系世界之間的橋梁。Hibernate 也支持用原始 SQL 或基于 Java 的標(biāo)準(zhǔn)和示例查詢表達(dá)查詢。Hibernate 使用 XML（*.hbm.xml） 文件把Java類映射到表，把 JavaBean 屬性映射到數(shù)據(jù)庫(kù)表。,Hibernate O/R Mapping,package hello; public class Message private

11、Long id; private String text; Private Message nextMessage; public Message() public Message(String text) this.text=text; public Long getId() return id; public void setId(Long id) this.id=id; public String getText() return text; public void setText(String text) this.text=text; public Message getNextMe

12、ssage() return nextMessage; public void setNextMessage(Message nextMessage) this.nextMessage=nextMessage; , ,AJAX,Ajax 由 HTML、JavaScript、DHTML 和 DOM 組成，可將 Web 界面轉(zhuǎn)化成交互性的 Ajax 應(yīng)用程序。 Ajax 是 Asynchronous JavaScript and XML（以及 DHTML 等）的縮寫(xiě)。 Ajax 核心 XMLHttpRequest 對(duì)象。,Ext,基于AJAX技術(shù)基礎(chǔ)之上的框架 Ext，在最開(kāi)始的時(shí)候，是作為YUI

13、的一個(gè)擴(kuò)展存在的，所以那個(gè)時(shí)候它的名稱是YUI.Ext，后來(lái)，Ext作為一個(gè)獨(dú)立的項(xiàng)目進(jìn)行開(kāi)發(fā)，并不再依賴于YUI,Ext,傳統(tǒng)的客戶端,富客戶端,其實(shí)這也是桌面應(yīng)用程序與WEB應(yīng)用程序之爭(zhēng)的結(jié)果!結(jié)果雙方妥協(xié),使用富客戶端,一方面滿足了使用WEB Browser進(jìn)行瀏覽;另一方面又可以實(shí)現(xiàn)快速方便的強(qiáng)大操作功能,即部分刷新功能及其他功能.EXT即建立于AJAX技術(shù)基礎(chǔ)之上的UI框架.,Ext 主要類,DWR,DWR(Direct Web Remoting) 是一個(gè)WEB遠(yuǎn)程調(diào)用框架，在基本的AJAX基本上發(fā)展而來(lái),利用這個(gè)框架可以讓AJAX開(kāi)發(fā)變得很簡(jiǎn)單。DWR主要由兩部分組成：javasc

14、ript與web服務(wù)器通信并更新web頁(yè)；運(yùn)行在web服務(wù)器的Servlet處理請(qǐng)求并把響應(yīng)發(fā)回瀏覽器。 主要的實(shí)現(xiàn)方式是在java代碼基礎(chǔ)上動(dòng)態(tài)的生成javascript代碼。web開(kāi)發(fā)者可以直接調(diào)用這些javascript代碼，然而真正的代碼是運(yùn)行在web服務(wù)器上的java code。出與安全考慮，開(kāi)發(fā)者必須配置哪些java class暴露給DWR.(配置dwr.xml),CORBA,公共對(duì)象請(qǐng)求代理體系結(jié)構(gòu)（common object request broker architecture） 分布式數(shù)據(jù)訪問(wèn) idl(interface description language) ,idlj -fall POA,Web Service,分布式服務(wù) WSDL Ax