什么是SVG
SVG，是可任意放縮矢量圖像格式（Scalable Vector Graphics）的簡稱。它基于XML(可擴展標識語言），是一個全新的標準開放的矢量圖像和動畫格式。SVG不同于傳統的二元（平面）圖像和動畫制作，它使用簡單的一元（文本）語句,完成矢量圖像，以及諸如色彩變化,對象運動,濾鏡和遮照，音效添加等各式動畫效果。SVG創造一個利用純文本完成網絡多媒體的神話。
SVG的特點
矢量圖像
圖像通常分為矢量圖像和位圖圖像。
矢量圖像利用點和線等矢量化的數據描述圖像，并在圖形中包含色彩和位置信息。矢量圖像的最大優點是"分辨率獨立"。當顯示或輸出圖像時，圖像的品質不受設備的分辨率影響，能夠提供高清晰的畫面。矢量圖相對位圖而言，更適合用于直接打印、印刷或輸出到一些小型設備如手提裝置上。放大和縮小矢量圖不會影響圖像品質。
而位圖圖像則使用我們稱為像素的一格一格的小點來描述圖像。計算機的屏幕其實就是一張包含大量像素點的網格。位圖圖像受到分辨率的影響。因此常常出現圖像邊緣鋸齒和放大后"馬賽克"現象。相對而言，位圖需要的存儲空間要比矢量圖更多。
SVG作為矢量圖像格式，同樣具備了矢量圖的諸多優點，更適合在網絡中傳輸和應用。SVG除了矢量圖的優勢，也同樣保持了對位圖圖像的正確表達功能。使用XML中的XLINK(擴展鏈接）標簽，SVG也可以在圖像中調用位圖圖像。
矢量濾鏡
雖然SVG圖像做為矢量圖格式，具有很多優點。但我們也看到，仍然有很多的圖像設計師傾向于使用位圖創作。這是因為位圖常常可以使用大量的濾鏡效果、紋理貼圖和空間幻影等，加強圖像的視覺效果。
但因為位圖的創作是直接針對像素操作，所以，一旦完成效果的添加，設計師幾乎無法再進行修改。例如，輸出一幅霧化效果的位圖圖像，您已經無法再恢復原來清晰的圖像。
而如果使用SVG支持的矢量濾鏡，設計師同樣可以創作出大量流行的和普遍的濾鏡效果。并且，這樣的濾鏡效果是可調整的。因為SVG的矢量濾鏡并不直接針對像素進行操作，而是作為某一個對象的獨立屬性保存在文件中。修改圖像效果只需要重新調整這些屬性，就可以完成對濾鏡的修改、替換和刪除，非常的便捷。SVG的矢量濾鏡對于遠程協作和二次編輯，提供了極大的自由度。
關于濾鏡的實例，請參看<<SVG中文教程>>。
基于XML
SVG的語法和結構基于XML（可擴展標識語言）。XML是下一代的網絡開發語言，它提供的功能遠遠超過了目前使用的HTML（超文本鏈接語言）。當一個網站變得越來越復雜的同時，為了獲得更好的管理和交互，網站開發者同樣需要一個比HTML更優秀的網絡開發語言和工具。這就是XML。
與HTML不同，XML完全分離了網站內容和網站構架。通過定義結構數據類型，用戶端應用程序能夠顯示和處理，而不僅僅像HTML那樣僅僅能顯示，網頁或數據。例如，一個利用XML標簽定義的電話號碼，可以根據需要，由瀏覽器進行撥號。XML所具有優秀的擴展性，使得它在網絡工業應用上，比HTML有著更大的空間和前景。
SVG的開發和創作是基于XML的，因此，我們也能在SVG中開發出更多新的功能以提供更多的網絡服務。例如，制作智能化的數據圖像。圖像中的數據可以根據需要，由應用程序讀取、修改和統計并最終在圖像中顯示。這些應用是目前HTML及相關圖像技術遠不可及的。
文本格式
SVG文件是一元（文本）格式的。SVG圖像和動畫具有了以下文本格式所具備的特點：
1、作為基于文本的格式，SVG圖像中的文字也是文本格式。這不同于現在圖像和動畫中的文字。目前圖像和動畫中的文字實質上都是圖像。因此，SVG中的文字可以被網絡搜索引擎做為關鍵詞搜尋。利用這一性質，通過SVG中定義的文字，就可以制作出非常高效的圖像搜索引擎。圖像中的文字也可以被用戶瀏覽器查找。
2、SVG圖像可以方便的由程序語言來動態的生成。例如使用JavaScript,perl,Java等語言，開發自動圖像和動畫生成系統。這對于一些數據庫制表是非常實用的。在線圖像還可以根據后臺數據庫中的關系量實時的進行動態改變。
3、SVG完全支持DOM(文檔物件模型)。因而SVG以及SVG中的對象可以通過腳本語言接受外部事件的驅動，例如鼠標動作、鍵盤動作等，實現對自身或對其他物件、圖像的控制，制作交互式的圖像和動畫。
4、因為是文本格式，SVG可以很好的跨平臺工作，同時，還可以解決相關的外部輸出、色彩模式、網絡帶寬等問題。
簡言之，文本格式使得SVG獲得了與其它技術標準更大的交互和融合的特點。
與GIF，JPEG比較
GIF，JPEG都是目前網絡普遍使用的位圖格式。SVG較GIF和JPEG有很多獨特的優勢：
1、具有很高的圖像品質。因為是矢量圖像，分辨率獨立，用戶可以自由的放縮圖像而不會破壞圖像的清晰度。這對于查看某些圖像細節例如數據圖像中的數字，非常的有用。
2、圖像中的文字獨立。如上一小節所述，SVG圖像中的文字獨立于圖像，可以進行文本編輯和查詢。
3、較小文件尺寸。因為基于矢量格式，由語句完成圖像的保存，SVG圖像相比較GIF和JPEG具有更小的文件大小,下載更加迅速。
4、色彩適應性更強。SVG圖像具有一個1600萬色彩的調色板,支持ICC（國際色彩協會)色彩標準,支持RGB色彩模式。
5、可交互性。SVG基于XML，因而能輕易的制作強大的動態交互。SVG圖像能對用戶動作做出不同響應，例如高亮,聲效,特效,動畫等，體現了網絡互動的本質。而GIF，JPEG都不可以產生交互。
與SWF比較
SWF文件格式是Flash的輸出文件格式。從某種意義上，SWF與SVG有很多驚人的相似之處。但是，盡管Flash憑借其優越的表現形式和便利的創作工具成為目前網絡動畫設計的首選，SWF日益在網絡中普及，但我們也應該看到，與SVG相比較，SWF存在著以下的不足：
1、SWF是一個非開放標準。這就意味著該技術掌握在個體手中，技術的發展受到方方面面的限制。同時，SWF與其他的開放標準也沒有完整的融合方案。盡管SWF目前已經提供了對XML的支持，但這種支持是單方面的。隨著XML及其他開放標準的發展，SWF的不協調性將日益顯著。
2、SWF的可編輯性不如SVG。SWF做為最終的動畫生成格式，其創作過程封裝在SWF文件中，幾乎無法再進行二次編輯。同時，SWF也不提供對文本格式的支持，因此，無法獲得類似SVG的查詢圖像中文字的功能。
svg工具分析
SVG創作工具
目前的SVG創作工具還處于開發和研制階段,仍然沒有一款非常成熟的包含靜態,動態,交互功能創作的軟件.這里介紹幾個目前可以進行一些研究和測試的SVG創作軟件.
Adobe Illustator
Adobe在SVG的開發中扮演了重要角色.Adobe Illustrator 9.0是較早的一款結合SVG功能的矢量創作軟件.目前可以進行靜態圖形的創作和部分交互功能的實現.其交互功能需要手寫javascript腳本.
創作AI圖像后,選擇File->Export(文件->輸出),選擇文件類型SVG,在SVG Option面板中設置相關屬性,可以輸出SVG文件,關于屬性設置,請參看<<SVG中文教程>>.
Web Draw
WebDraw是Jasc Software按照W3C組織制定的SVG規范書開發的矢量圖像和動畫制作工具,專業應用于SVG創作.WebDraw通過直接畫布拖拽繪圖以及濾鏡效果模塊化組合,可以避免手寫源代碼.同時提供源代碼視圖窗口,支持后續源代碼編輯和修改.
軟件的整體布局類似于目前許多的圖形創作軟件.與職業的矢量創作軟件Adobe Illustrator和Corel Draw相比較,Web Draw在功能上還不足以抗衡,但作為專業開發SVG的創作工具,也許可以預想,經過一段時間的積累,它將成為下一個成功的Fireworks.(Fireworks成功的開發了PNG格式.)
最新版本是Preview Release 4.目前還不支持動態SVG效果.另外, 應用濾鏡效果并不能在畫布真實表達輸出后的SVG圖像.
下載(4.45M):
http://www.jasc.com/webdraw.asp (國外)
http://www.2svg.com/ (國內)
Web Engine
IMS Web Engine (Interactive Multimedia System)是Virtural Mechanics開發的一款網頁創作軟件,主要應用于創作靜態和動態的HTML,DHTML和SVG頁面.Web Engine是目前極少數不需要通過手寫代碼即可完成SVG動態交互創作的工具.它的精靈向導可以很快的定義簡單的交互動作.
Web Engine的界面比較粗曠,或者說不是很精細,很多操作是雙擊對象彈出面板,調整選項,這有點像當時的Flash3.0和4.0.Web Engine有一個比較不足的地方,給設計者帶來很大的限制,就是沒有提供源代碼視圖,無法直接進行源代碼的修改和編輯.
目前的版本是 Version 2 Beta.
下載(3.86M):
http://www.virtualmechanics.com/(國外)
http://www.2svg.com/ (國內)
市場分析
SVG的應用價值
網絡發展的需要,與其他開放標準兼容
如同PNG作為W3C的位圖圖像工業標準,SVG是網絡中解決矢量圖像的工業標準.在SVG以前,除了Macromedia開發了SWF作為矢量的網絡文件格式,還沒有其他的矢量文件在網絡中應用.因為位圖文件受到本身的很多局限,在圖形印刷和傳輸中,矢量文件有很大的應用價值,所以,必定會有相應的矢量標準得到開發和應用,這就是SVG.
作為W3C的推薦格式,SVG與現有的其他開放標準有很好的兼容性.這些標準包括DOM1，DOM2，CSS，XML，XPointer，XSLT，XSL，SMIL，HTML，XHTM等L.SVG與其他組織的標準化技術也能很好的協調一致，如ICC，URI，UNICODE，sRGB，ECMAScript/JavaScript，Java.
使用SVG并不意味著我們將從此放棄現在的網絡圖像技術如GIF，JPEG，SWF.相比較這些目前有普遍應用的文件格式,SVG更適合網絡發展的需求,開發和應用SVG意味著獲得一個更優秀的工具和方法.
數據表格,圖像地圖
在應用領域,SVG可以非常適宜的應用在數據表格和圖像地圖中.在SVG的源文件中,通過變量可以很方便的控制需要的圖形生成.這就為網絡圖像數據表格提供了很大的應用前景.一個簡單的例子,現有的asp可以方便的構建動態數據網頁,利用SVG,則可以同樣方便的繪制動態數據圖像,例如數據分析中的柱狀圖和餅狀圖.
制作圖像地圖同樣是SVG的一大優勢.由于SVG是矢量格式,圖像可以在任何顯示分辨率下獲得同樣的圖像效果,文件放大觀看時也不會有任何的品質損失,因而可以完全可以制作這樣的圖像地圖,其中包含了一個城市所有的地理信息,文件可以根據觀看這不同的需要,對不同的地區進行放大顯示,同時,每一個地理名詞又可以獨立的包含一段文字說明,或者包含相應的地理數據,但用戶需要時,可以通過點擊地理名詞獲得解釋說明.這樣的圖像地圖文件的文件大小也僅僅是K字節級別.
無線設備的需求
SVG另一個非常誘人的應用前景就是開發無線設備的圖形和動畫.例如目前使用的手機產品,其圖像主要是WBMP.這種格式因為是位圖文件,受到傳輸大小的限制,同時不提供彩色的色彩模式,所以顯得很呆板.而如果利用SVG,只要在無線設備中安裝一個文本解析器,就可以實現對SVG文件的識別和顯示,同時,因為是矢量的文本文件,文件的尺寸不會很大,非常適合無線產品的網絡傳輸.SVG還提供動畫和多媒體編輯功能,所以可以支持二維的平面動畫,支持聲音文件和視頻文件的播放.結合一些其他的技術,例如SMIL(多媒體同步整合語言),就可以實現創建一個非常理想的多媒體無線終端解決方案.
圖像搜索引擎
不同于現在的二維圖像,SVG是一個可實現交互和查詢的文件格式.在SVG圖像中,信息是一元代碼形式的,是開放形式的.文字獨立于圖形信息.這就為圖像搜索和查詢提供了可能.例如,在一個SVG動畫中,通過搜索某一個關鍵字,就可以在圖像中查詢到對應的信息.而這對于同樣是矢量圖像和動畫格式的SWF就不可能實現.依據SVG的這種交互性,可以創建大型的圖像搜索引擎.
網頁設計思想的改變
采用SVG進行網頁設計,是下一代的網頁設計思想.現在的網頁設計,通常是在位圖圖像軟件中繪制好整體頁面圖像,然后進行圖像切割,最后完成頁面的文字編輯.通常這樣的工作是很繁瑣的,進行二次修改也很不簡便.而利用SVG,則可以實現頁面圖形設計和文字編輯的一步完成.如果要進行遠程協作完成網頁設計,也只需要傳輸創作后的頁面文件,而不必將所有的圖像源文件和頁面文件都傳輸.
因為SVG能夠很好的與HTML和XML兼容,所以,下一代的網頁編輯軟件將開始結合圖像創作功能.許多現在需要通過外部圖像或動畫軟件創作的效果,將可以直接在網頁編輯軟件中完成.
結合SVG創作網頁,將使網頁設計師真正可以"畫"出頁面.
另外，有一些專業的計算機軟件公司開發基于web的圖形化軟件，看到了svg的優勢和前景。但是苦于沒有一個好的創作工具而放棄。這是一個大的市場，筆者一直想開發一個用于軟件公司的產品。
這個工具一旦誕生，將是世界首家。市場非常廣闊。
產品目標定義
產品的目標除了吸收目前市場上產品的優點
可以用簡單的圖元進行靜態svg的設計創建，同步源碼和展現預覽以外
增加新的目標是。
1， java開發，跨平臺
2， 工具可以和數據庫交互
3， 可以定義事件
4， 增加組件庫
5， 提供api供其它java軟件項目調用
市場目標定位
第一步：面向專業的計算機公司
第二步：面向廣告公司及更大的客戶群
組件設計工具
可以通過簡單的圖元和已有組件進行新的組件設計，但不涉及事件定義，只是簡單的靜態圖形文件的創建。
總體設計工具
可以通過簡單的圖元和已有組件進行總體圖形的設計。可以進行事件腳本設計，可以和后臺數據庫關聯。圖形屬性更加豐富。
java解析展現工具
可以在java app的Jpanel上解析展現svg文件。