本節(jié)和大家一起學(xué)習(xí)一下SVG與UML圖方面的內(nèi)容，本節(jié)主要介紹了SVG的三種圖像對(duì)象和UML圖的七種類型，希望通過本節(jié)的學(xué)習(xí)你對(duì)UML圖有清晰的認(rèn)識(shí)。

SVG與UML圖

SVG是W3C的一種圖形矢量標(biāo)準(zhǔn)，與Flash相似，它們都可以在網(wǎng)上快速加載矢量圖。雖然目前SVG還沒有Flash那么好的可用性，但其基于XML，倒是先天優(yōu)勢(shì)，有繼續(xù)發(fā)展成為主流的可能性。在網(wǎng)上使用SVG技術(shù)顯示UML圖，不僅可以在瀏覽器內(nèi)無(wú)失真地對(duì)對(duì)象執(zhí)行縮放和平移等操作，還可以利用Xlink、XPointer等XML技術(shù)將大圖分解，化簡(jiǎn)為小圖瀏覽，甚至結(jié)合后臺(tái)數(shù)據(jù)庫(kù)直接存取元數(shù)據(jù)信息，并將結(jié)果動(dòng)態(tài)地繪制為UML圖，在網(wǎng)上顯示出來(lái)。SVG強(qiáng)大的事件及腳本功能，也使得UML圖具有更強(qiáng)的交互性和更為豐富的表達(dá)能力。本文在粗略介紹SVG和UML兩種技術(shù)的基礎(chǔ)上，描述了使用SVG繪制UML圖形的過程中會(huì)用到的一些技術(shù)以及相關(guān)工具，UML圖可以從不同的角度出發(fā)劃分為一系列標(biāo)準(zhǔn)組件元素，利用它們基本上就可以無(wú)障礙地構(gòu)建各種UML圖。

一、SVG

可縮放矢量圖形（SVG）是W3C的推薦標(biāo)準(zhǔn)，它使用XML描述兩維圖形結(jié)構(gòu)和圖形應(yīng)用，可以在Web瀏覽器、手持設(shè)備或移動(dòng)電話等多種上顯示。目前穩(wěn)定版本為1.1版，***的版本是以草案形式存在的1.2版，并未最終定稿。

在SVG中，允許三種圖像對(duì)象存在，分別是矢量圖像、點(diǎn)陣圖像和文本。SVG定義了六種常用的基本矢量形狀，包括直線、圓形、橢圓形、矩形、多邊形和折線，在此基礎(chǔ)上，利用坐標(biāo)變換、路徑、動(dòng)畫、濾鏡圖案等功能擴(kuò)展，通過多層次組合矢量、點(diǎn)陣以及文本圖，并配以各種屬性，進(jìn)行矢量繪圖。
經(jīng)過一段時(shí)期的發(fā)展，SVG的業(yè)務(wù)領(lǐng)域慢慢也已拓展開來(lái)，涵蓋Web圖表、地圖、框圖、流程圖、項(xiàng)目計(jì)劃圖等多種類別。構(gòu)建各個(gè)領(lǐng)域中的基本元件庫(kù)也成為迫切需求，一些開源項(xiàng)目正以此為目標(biāo)，提供可重用、基于SVG的元件庫(kù)。UML圖可以明確地按照種類劃分，針對(duì)不同的種類，提出基本組件，再結(jié)合SVG固有的功能，就可以很容易地使用SVG創(chuàng)建出多種UML應(yīng)用。
SVG的語(yǔ)法非常簡(jiǎn)單，設(shè)計(jì)人員一般在一天之內(nèi)就會(huì)熟悉，IBMDeveloperworks中也有SVG的專題討論，這里也就不再贅述了。

二、UML圖

UML是目前最常用的一種面向?qū)ο蠼ＵZ(yǔ)言，主要包括七種常見的類型，即用例圖、類圖、序列圖、狀態(tài)圖、活動(dòng)圖、組件圖和部署圖，分別用以不同的建模用途。

類圖，類圖可以將一組類、界面、合作以及上述元素之間的關(guān)系顯示出來(lái)，通常分為邏輯類和實(shí)現(xiàn)類。

組件圖，以可視化方式提供系統(tǒng)的物理視圖，顯示系統(tǒng)中組件的依賴關(guān)系。

部署圖，顯示系統(tǒng)如何物理部署到硬件環(huán)境之中，是節(jié)點(diǎn)和連線的集合。上面三種UML圖都是對(duì)系統(tǒng)靜態(tài)特征進(jìn)行建模，下面的四種描述系統(tǒng)動(dòng)態(tài)特征。

用例圖，描述系統(tǒng)的功能單元，它以圖形化的方式表示系統(tǒng)內(nèi)部的用例，系統(tǒng)外部的參考者，以及它們之間的交互。

序列圖，強(qiáng)調(diào)時(shí)間順序，顯示特定用例的詳細(xì)流程。順序圖有兩維：垂直方向是以時(shí)間順序顯示消息/調(diào)用序列，水平方向顯示消息發(fā)送到的對(duì)象實(shí)例。

狀態(tài)圖，描述系統(tǒng)動(dòng)態(tài)特征，包括狀態(tài)、轉(zhuǎn)換、事件以及活動(dòng)等。

活動(dòng)圖，描述系統(tǒng)在處理某項(xiàng)活動(dòng)時(shí)，兩個(gè)或多個(gè)對(duì)象之間的過活動(dòng)流程。

UML中還包含其它一些圖，例如對(duì)象圖、包圖、組合圖等，以及演化出的一些新的概念，如模板(Stereotypes)、職責(zé)(Responsibilities)、擴(kuò)展機(jī)制(Extensibilitymechanisms)、線程(Threads)、過程(Processes)、分布式(Distribution)、并發(fā)(Concurrency)、模式(Patterns)等，是否使用要依據(jù)建模過程中系統(tǒng)的層次、分類和大小等具體情況而定。誠(chéng)然，對(duì)于個(gè)體來(lái)說(shuō)，我們并不會(huì)用到所有的符號(hào)，但一個(gè)完整的UML建模工具卻是要盡可能詳盡地考慮到UML中豐富的符號(hào)語(yǔ)法和語(yǔ)義信息。在這里，我們無(wú)法描述清楚使用SVG繪制每種UML符號(hào)的方法，我們要關(guān)注的是UML基本符號(hào)元件的劃分以及使用SVG繪制UML圖的一些常用方法和便利之處。
 

【編輯推薦】

1. UML圖中用例圖和活動(dòng)圖簡(jiǎn)介
2. SVG與UML圖詳解
3. UML用例圖用法實(shí)例剖析
4. 術(shù)語(yǔ)匯編 UML統(tǒng)一建模語(yǔ)言簡(jiǎn)介
5. UML學(xué)習(xí)手冊(cè)新手必備