天天看點

可縮放矢量圖形 SVG

維基百科,自由的百科全書

跳轉到: 導航, 搜尋

跳過字詞轉換說明

漢漢▼▲為了閱讀友善,本文使用全文手工轉換。轉換内容:

本文采用電腦和資訊技術組全文轉換 [檢視] • [編輯] • [強制重新整理]

顯示↓關閉↑字詞轉換說明

字詞轉換是中文維基的一項自動轉換,目的是通過計算機程式自動消除繁簡、地區詞等不同用字模式的差異,以達到閱讀友善。字詞轉換包括全局轉換和手動轉換,本說明所使用的标題轉換和全文轉換技術,都屬於手動轉換。

如果您想對我們的字詞轉換系統提出一些改進建議,或者送出應用面更廣的轉換(中文維基百科全站乃至MediaWiki軟體),或者報告轉換系統的錯誤,請前往Wikipedia:字詞轉換請求或候選發表您的意見。

可縮放矢量圖形 

擴充名 .svg, .svgz

網際網路媒體類型 image/svg+xml[1]

開發者 網際網路聯盟

格式 矢量圖形

延伸自 xml

這張圖檔展示了位圖和矢量圖的差別。位圖是由點構成的,矢量圖則是由一些形狀元素構成。該圖中顯示放大位圖可以看到點,而放大矢量圖看到的仍然是形狀。SVG屬于矢量圖,是以能夠無級縮放,而不會導緻馬賽克。可縮放矢量圖形(Scalable Vector Graphics,SVG)是基于可擴充标記語言(XML),用于描述二維矢量圖形的一種圖形格式。SVG由W3C制定,是一個開放标準。

目錄 [隐藏]

1 SVG概述

1.1 SVG Basic

1.2 SVG Tiny

2 SVG技術細節

3 标準制定開發曆史

4 示例

5 SVG顯示

5.1 插件支援

5.2 本地支援

5.3 各種SVG解釋器支援程度比較

6 設計工具

7 軟件支援

8 參考資料

9 外部連接配接

[編輯] SVG概述

SVG嚴格遵從XML文法,并用文本格式的描述性語言來描述圖像内容,是以是一種和圖像分辨率無關的矢量圖形格式。SVG格式具有以下優點:

圖像檔案可讀,易于修改和編輯

與現有技術可以互動融合。例如,SVG技術本身的動态部分(包括時序控制和動畫)就是基于SMIL标準。另外,SVG檔案還可嵌入JavaScript(嚴格地說,應該是ECMAScript)腳本來控制SVG對象

SVG圖形格式可以友善的建立文字索引,進而實作基于内容的圖像搜尋

SVG圖形格式支援多種濾鏡和特殊效果,在不改變圖像内容的前提下可以實作位圖格式中類似文字陰影的效果

SVG圖形格式可以用來動态生成圖形。例如,可用SVG動态生成具有互動功能的地圖,嵌入網頁中,并顯示給終端使用者

SVG面臨的主要問題一個是如何和已經占有重要市場佔有率的矢量圖形格式Adobe Flash競争的問題,另一個問題就是SVG的本地運作環境下的廠家支援程度。

[編輯] SVG Basic

SVG Basic又稱SVGB,是英語「Scalable Vector Graphics, Basic Profile」的簡寫,可以翻譯為「可縮放的矢量圖形标準的基本版」。它是SVG的一個子集,而主要目标是為掌上電腦等高端移動裝置提供矢量圖形顯示格式。

[編輯] SVG Tiny

SVG Tiny又稱SVGT,是英語「Scalable Vector Graphics, Tiny Profile」的簡寫,可以翻譯為「可縮放的矢量圖形标準的微型簡化版本」。它也是SVG的一個子集,而主要目标是為手機等低端移動裝置提供矢量圖形顯示格式。

[編輯] SVG技術細節

簡單SVG圖檔,樣如少女。SVG主要支援以下幾種顯示對象:

矢量顯示對象,基本矢量顯示對象包括矩形、圓、橢圓、多邊形、直線、任意曲線等

嵌入式外部圖像,包括PNG、JPEG、SVG等

文字對象

SVG可以實作動态和互動功能。在DOM模型的基礎上,SVG開發設計人員可以利用ECMAScript或者SMIL來進行時序控制或對象的操縱。SVG雖然是文本格式,但是SVG支援利用gzip壓縮算法減少檔案尺寸,壓縮後的檔案通常用被稱為「SVGZ檔案」。

[編輯] 标準制定開發曆史

W3C于2001年9月4日釋出SVG 1.0。

W3C于2003年1月4日釋出SVG 1.1。

W3C于2003年1月14日推出SVG移動子版本:SVG Tiny和SVG Basic。

2008年12月22日,SVG Tiny 1.2成為W3C的推薦标準。

W3C目前正在研究制定SVG 1.2版本。

[編輯] 示例

示例SVG顯示如圖SVG格式是XML的一種,SVG檔案其實隻是普通的文本檔案,用一般的文本編輯器便可檢視或修改。

<?xml version="1.0"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"

    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg xmlns="http://www.w3.org/2000/svg" version="1.1"

    width="467" height="462">

  <!-- This is the red square: -->

  <rect x="80" y="60" width="250" height="250" rx="20" fill="red"

         stroke="black" stroke-width="2px" />

  <!-- This is the blue square: -->

  <rect x="140" y="120" width="250" height="250" rx="40" fill="blue"

         stroke="black" stroke-width="2px" fill-opacity="0.7" />

</svg>

[編輯] SVG顯示

[編輯] 插件支援

目前,最常用的SVG插件來自Adobe公司(Adobe SVG Viewer),另外Corel也提供SVG浏覽器(Corel SVG Viewer)。

[編輯] 本地支援

比較著名的 SVG 項目包括 Mozilla SVG Project,KDE 的 KSVG,以及 Amaya 等。

Mozilla Firefox自版本 1.5 發行後,即開始支援 SVG 格式的顯示。

基于 Java 的 SVG 項目主要有 Batik SVG Toolkit 等。

Opera、Google Chrome和Safari支援SVG顯示。

Microsoft的Internet Explorer至8.0版為止,尚未支援SVG。

[編輯] 各種SVG解釋器支援程度比較

W3C的SVG網站上有一個測試套件可以用來測試SVG解釋器對于标準的支援。這個套件既可以線上運作也可以下載下傳到本地運作。截至2007年中,對于流行的SVG軟體有如下測試結果:

對SVG支援最好的浏覽器是Opera,它支援大多數的SVG特性。

對于專門的SVG浏覽器,Batik SVG viewer能對大多數特性有良好支援,與Opera不相伯仲。但它不能和浏覽器互動。

加載了Adobe SVG Viewer的Internet Explorer也能支援多數SVG特性,但是由于沒有浏覽器的原生支援,在互動方面許多特性不支援。

Mozilla Firefox 2.0對SVG特性的支援相當弱,許多重要特性如動畫等都不能支援。

[編輯] 設計工具

能夠設計SVG圖形作品的軟體工具包括Adobe Illustrator以及CorelDRAW等。

而開放源代碼的軟件有Scribus、Karbon14、Inkscape以及Sodipodi等。

[編輯] 軟件支援

Adobe 公司 SVG 插件 及 Adobe 公司 SVG 應用執行個體示範

Inkscape 開放源代碼的軟體

Karbon14 開放源代碼的軟體

Sodipodi 開放源代碼的軟體

Mozilla SVG and Mozilla SVG 示範

Firefox 1.5-首個 Firefox 版本開始支援顯示 SVG 格式

Opera 瀏覽器-Opera 8.0 版開始支援顯示 SVG Tiny 1.1 的 spec 規格

[編輯] 參考資料

^ M Media Type registration for image/svg+xml

[編輯] 外部連接配接

相關的維基共享資源:

可縮放矢量圖形 W3C SVG 官方标準網站

svg.org 社群消息網站

svgx.org 新聞及資源網

about-svg.de

svgwiki

SVG Web

Opera開發網站上關于SVG的展示及教程(英文)