1. SVG元素模塊
Animation.Module | animate animateColor animateTransform animateMotion set mpath |
剪裁模塊 | clipPath |
顏色輪廓模塊 | color-profile |
條件處理模塊 | switch |
光標模塊 | cursor |
擴展性模塊 | foreignObject |
過濾器模塊 | filter feFlood feColorMatrix feComponentTransfer feComposite feConvolveMatrix feDiffuseLighting feDisplacementMap feFlood feGaussianBlur feImage feMerge feMergeNode feMorphology feOffset feSpecularLighting feTile feTurbulence feDistantLight fePointLight feSpotLight feFuncR feFuncG feFuncB feFuncA |
Font.Module | fontfont-face glyph missing-glyph hkern vkern font-face-src font-face-uri font-face-format font-face-name definition-src |
梯度模塊 | linearGradientradialGradientstop |
Hyperlink.Module | a |
圖像模塊
|
image |
標記模塊 | marker |
遮罩模塊 | mask |
陣列模塊 | pattern |
腳本模塊 | script |
造型模塊 | path rect circle line polyline polygon ellipse |
結構模塊 | svg g defs desc title metadata symbol use |
樣式模塊 | style |
文本模塊 | text tspan tref textPath altGlyph altGlyphDef altGlyphItem glyphRef |
視圖模塊 | view |
2.SVG解釋的元素
2.1 超鏈接模塊
元素 |
屬性 |
描述 |
a | Core.attrib, Conditional.attrib, Style.attrib, transform, target, GraphicalEvents.attrib, Presentation.attrib, External.attrib, XLinkReplace.attrib | 聯結一組圖元, 以鏈接屬性(本地或非本地 URI)。該鏈接在可視化過程中處於非活動狀態,但每次轉換到 CGM 時都保存該鏈接。 |
2.2 圖像模塊
元素 |
屬性 |
內容模型 |
image |
Core.attrib, XLinkEmbed.attrib, Conditional.attrib, Style.attrib, External.attrib, GraphicalEvents.attrib, preserveAspectRatio, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, Profile.attrib, Viewport.attrib, transform, x, y, width, height |
描述通過外部文件鏈接(相對路徑或絕對路徑)或通過 base64 編碼(這種情況下,可以讀取的格式有:BMP、JPEG、TIFF 或 PNG)定義的矢量圖像或位圖圖像。 支持外部位圖圖像鏈接,但不支持矢量圖像鏈接。 |
2.3 標記模塊
元素 |
屬性 |
內容模型 |
marker |
Core.attrib, External.attrib, Style.attrib,Presentation.attrib, viewBox,preserveAspectRatio,refX, refY,markerUnits, markerWidth, markerHeight, orient |
通過標記屬性定義一組重用作標記的圖元。 不考慮 markerUnits 屬性,它被視爲與屬性 userSpaceOnUse 相同。 不考慮 orient 屬性,標記不按照路徑段定向。應用標記時始終不定向。 |
2.4 陣列模塊
元素 |
屬性 |
內容模型 |
pattern |
Core.attrib, XLink.attrib, Conditional.attrib , External.attrib, Style.attrib, Presentation.attrib, viewBox, preserveAspectRatio, patternTransform, x, y, width, height, patternUnits | 定義一組重用於填充或繪製造型的圖元。 不考慮 patternUnits 屬性,它被視爲與屬性 userSpaceOnUse 相同。 僅解釋用位圖陣列定義的陣列。不識別用向量元素集定義的陣列。 因此,陣列元素的子級應爲 <image> 類型。這樣可以讀取包含填充紋理的工程製圖文檔。 |
2.5 造型模塊
元素 |
屬性 |
內容模型 |
path |
Core.attrib, Conditional.attrib, External.attrib, Style.attrib, transform, d, pathLength, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, Marker.attrib |
定義造型的輪廓。它由圓弧、橢圓弧、直線、三次貝塞爾曲線<!--webbot bot="HTMLMarkup" startspan --><!--webbot bot="HTMLMarkup" endspan -->和二次貝塞爾曲線<!--webbot bot="HTMLMarkup" startspan --><!--webbot bot="HTMLMarkup" endspan -->組成。此輪廓可以是封閉的或開放的。更多信息可參見“SVG中Path路徑指令教程”。 |
rect |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, x, y, width, height, rx,ry,transform |
定義矩形。 不解釋圓角。 |
circle |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, cx, cy, r, transform |
定義圓。 |
line |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, x1, y1, x2, y2, transform |
定義直線。 |
ellipse |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, cx, cy, rx, ry, transform |
定義橢圓。 |
polyline |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, points, transform |
定義折線。
|
polygon |
Core.attrib, Conditional.attrib, Style.attrib, GraphicalEvents.attrib, Paint.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, points, transform |
定義多邊形 |
2.6 結構模塊
元素 |
屬性 |
內容模型 |
svg |
Core.attrib, Conditional.attrib, Style.attrib, x, y, width, height, viewBox, preserveAspectRatio, zoomAndPan, version, baseProfile, contentScriptType, contentStyleType, External.attrib, Presentation.attrib, GraphicalEvents.attrib, DocumentEvents.attrib |
編組 SVG 圖像。 |
g |
Core.attrib, Conditional.attrib, Style.attrib, External.attrib, Presentation.attrib, GraphicalEvents.attrib, transform |
將具有相同屬性的一個或多個元素編組在一起。 |
defs |
Core.attrib, Conditional.attrib, Style.attrib, External.attrib, Presentation.attrib, GraphicalEvents.attrib, transform |
定義要重用的元素組。它的子級因此是參考元素。 |
desc |
Core.attrib, Style.attrib |
描述元素。 |
title |
Core.attrib, Style.attrib |
指示元素的標題。 |
symbol |
Core.attrib, Style.attrib, External.attrib, viewBox, preserveAspectRatio, Presentation.attrib, GraphicsElementEventAttrs |
定義一組要重用的元素。 |
use |
Core.attrib, Style.attrib, Conditional.attrib, transform,x, y, width, height, XLinkEmbed.attrib, Presentation.attrib, GraphicsElementEventAttrs |
參考一組預定義元素以便顯示它。 |
2.7 文本模塊
元素 |
屬性 |
內容模型 |
text | Core.attrib, Conditional.attrib, External.attrib, Style.attrib, transform, x, y, dx,dy,rotate, textLength,lengthAdjust, GraphicalEvents.attrib,Paint.attrib, Font.attrib, Opacity.attrib, Graphics.attrib, Cursor.attrib, Filter.attrib, Mask.attrib, GraphicalEvents.attrib, Clip.attrib, TextContent.attrib, Text.attrib | 定義文本。
文本顏色是筆畫顏色定義的顏色,如果沒有明確定義筆畫顏色,則使用填充顏色。 |
三、SVG模塊屬性
3.1 動畫屬性集
集合名稱 |
集合屬性 |
Animation.attrib |
XLink.attrib |
AnimationAttribute.attrib |
attributeName, attributeType |
AnimationTiming.attrib |
begin, dur, end, min, max, restart, repeatCount, repeatDur, fill |
AnimationValue.attrib |
calcMode, values, keyTimes, keySplines, from, to, by |
AnimationAddtion.attrib |
additive, accumulate |
3.2 動畫事件屬性模塊
集合名稱 |
集合屬性 |
AnimationEvents.attrib |
onbegin, onend, onrepeat, onload |
3.3 剪裁屬性集
集合名稱 |
集合屬性 |
Clip.attrib |
clip-path, clip-rule |
3.4 條件處理屬性集
集合名稱 |
集合屬性 |
Conditional.attrib |
requiredFeatures, requiredExtensions, systemLanguage |
3.5 容器屬性模塊
集合名稱 |
集合屬性 |
Container.attrib |
enable-background |
3.6 內核屬性模塊
集合名稱 |
集合屬性 |
Core.attrib |
id, xml:base, xml:lang, xml:space |
3.7 光標屬性集
集合名稱 |
集合屬性 |
Cursor.attrib |
cursor |
3.8 文檔事件屬性模塊
集合名稱 |
集合屬性 |
DocumentEvents.attrib |
onunload, onabort, onerror, onresize, onscroll, onzoom |
3.9 外部資源要求屬性模塊
集合名稱 |
集合屬性 |
External.attrib |
externalResourcesRequired |
3.10 梯度屬性集
集合名稱 |
集合屬性 |
Gradient.attrib |
stop-color, stop-opacity |
3.11 圖形元素事件屬性模塊
集合名稱 |
集合屬性 |
GraphicalEvents.attrib |
onfocusin, onfocusout, onactivate, onclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onload |
3.12 圖形屬性模塊
集合名稱 |
集合屬性 |
Graphics.attrib |
display, image-rendering, pointer-events, shape-rendering, text-rendering,visibility |
3.13 過濾器屬性集
集合名稱 |
集合屬性 |
Filter.attrib |
filter |
FilterColor.attrib |
color-interpolation-filters |
FilterPrimitive.attrib |
x, y, width, height, result |
FilterPrimitiveWithIn.attrib |
FilterPrimitive.attrib, in |
3.14 標記屬性集
集合名稱 |
集合屬性 |
Marker.attrib |
marker-start, marker-mid, marker-end |
3.15 遮罩屬性集
集合名稱 |
集合屬性 |
Mask.attrib |
mask |
3.16 不透明屬性模塊
集合名稱 |
集合屬性 |
Opacity.attrib |
opacity, stroke-opacity, fill-opacity |
3.17 塗料屬性模塊
集合名稱 |
集合屬性 |
Paint.attrib |
color, fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-width, color-interpolation, color-rendering |
3.18 樣式屬性集
集合名稱 |
集合屬性 |
Style.attrib |
style, class |
3.19 文本屬性集
集合名稱 |
集合屬性 |
Text.attrib |
writing-mode |
TextContent.attrib |
alignment-baseline, baseline-shift, direction, dominant-baseline, glyph-orientation-horizontal, glyph-orientation-vertical, kerning, letter-spacing, text-anchor, text-decoration, unicode-bidi, word-spacing |
Font.attrib |
font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight |
3.20 視口屬性模塊
集合名稱 |
集合屬性 |
Viewport.attrib |
clip, overflow |
視口屬性更多的文章請瀏覽:"SVG格式圖形顯示的座標系統規則"
3.21 XLink 屬性模塊
集合名稱 |
集合屬性 |
XLink.attrib |
xlink:type, xlink:href, xlink:role, xlink:arcrole, xlink:title, xlink:show, xlink:actuate |
XLinkRequired.attrib |
xlink:type, xlink:href, xlink:role, xlink:arcrole, xlink:title, xlink:show, xlink:actuate |
XLinkEmbed.attrib |
xlink:type, xlink:href, xlink:role, xlink:arcrole, xlink:title, xlink:show, xlink:actuate |
XLinkReplace.attrib |
xlink:type, xlink:href, xlink:role, xlink:arcrole, xlink:title, xlink:show, xlink:actuate |
四、SVG解釋的屬性
4.1 內核屬性模塊
集合名稱 |
集合屬性 |
id | 圖形圖元的標識符。 |
4.2 圖形屬性模塊
集合名稱 |
集合屬性 |
display | 顯示或隱藏圖形圖元。
僅解釋值“none”。 |
4.3 標記屬性集
集合名稱 |
集合屬性 |
marker-start | 在圖元的第一個點繪製標記。 |
marker-mid | 在圖元的每個其它點(即除第一個點和最後一個點)繪製標記。 |
marker-end | 在圖元的最後一個點繪製標記。 |
4.4 不透明屬性模塊
集合名稱 |
集合屬性 |
opacity | 定義圖元的透明度。 只有能夠另存爲光柵圖像的格式纔可以管理透明度。因此,不顯示透明度。 而且,即使當另存爲光柵圖像時,透明度也不支持嵌套。 |
stroke-opacity | 定義圖元輪廓的透明度。 只有能夠另存爲光柵圖像的格式纔可以管理透明度。因此,不顯示透明度。 而且,即使當另存爲光柵圖像時,透明度也不支持嵌套。 |
fill-opacity | 定義圖元填充的透明度。 只有能夠另存爲光柵圖像的格式纔可以管理透明度。因此,不顯示透明度。 而且,即使當另存爲光柵圖像時,透明度也不支持嵌套。 |
4.5 塗料屬性模塊
集合名稱 |
集合屬性 |
color | 定義顏色。<color> 類型符合 sRGB 空間中定義的顏色的 CSS2 規格。該屬性支持 [CSS2-color-types] 中定義的幾種語法(有關詳細信息,請訪問 w3c.org Internet 站點),還支持一個關鍵字列表,列表中的每個關鍵字與一種顏色關聯。
支持的數字顏色規格語法有:#rgb 或 #rrggbb 或 rgb(R, G, B) 或 rgb(R%, G%, B%)。 EM { color:#f00 } /* #rgb */ EM { color:#ff0000 } /* #rrggbb */ EM { color:rgb(255,0,0) } /* integer range 0 - 255 */ EM { color:rgb(100%, 0%, 0%) } /* float range 0.0% - 100.0% */ |
fill | 定義填充類型。 支持“none”、“current-color”值或顏色。 不支持梯度。 |
fill-rule | 定義填充多邊形時使用的算法。 僅支持“nonzero”算法。 不支持“evenodd”算法。 |
stroke | 定義如何繪製元素。 支持“none”、“current-color”值或顏色。 不支持陣列和梯度。 |
stroke-dasharray | 定義爲得到點線所應用的陣列。 |
stroke-linecap | 定義繪製輪廓時在輪廓的末尾使用的造型:round, square 等。 以向量格式保存時包括此屬性。但是,不支持顯示和以光柵格式保存它。 |
stroke-linejoin | 定義繪製折線的角時使用的造型:round, miter 等。 以向量格式保存時包括此屬性。但是,不支持顯示和以光柵格式保存它。 |
stroke-width | 定義筆畫寬度。 以向量格式保存時包括此屬性。但是,使用細寬度可以描繪非常粗的筆畫。 |
4.6 樣式屬性集
集合名稱 |
集合屬性 |
style | 將所有屬性編組在一起。 |
4.7 文本屬性集
集合名稱 |
集合屬性 |
letter-spacing | 定義每個字符之間使用的間距。 TrueType 字體顯示不支持該屬性,因此也不支持大量的生成器(離散化)。 |
text-anchor | 定義文本對齊方式。 |
font-family | 定義字體系列的名稱。 僅正確解釋第 5 版支持的字體,否則使用默認字體。更多信息... |
font-size | 定義文本高度。 高度必須定義爲長度或百分比。 |
font-weight | 定義是使用粗體還是普通樣式呈現文本。 TrueType 字體顯示不支持該屬性,因此也不支持大量的生成器(離散化)。 |
4.8 XLink 屬性模塊
集合名稱 |
集合屬性 |
xlink:href | 定義鏈接。爲鏈接元素或定義光柵圖像解釋該屬性。 |
xlink:show | 定義如何顯示鏈接指向的資源。 |
4.9 變換屬性
分析和處理變換屬性。應用下面的變換:
- matrix(<a> <b> <c> <d> <e> <f>),以六個值的變換矩陣形式指定變換
- translate(<tx> [<ty>]),通過 tx 和 ty 指定平移
- scale(<sx> [<sy>]),通過 sx 和 sy 指定縮放操作
- rotate(<rotate-angle> [<cx> <cy>]),指定繞給定點旋轉 <rotate-angle> 度
- skewX(<skew-angle>),指定沿 x 軸的扭曲變換
- skewY(<skew-angle>),指定沿 y 軸的扭曲變換。