データ型

角度は 2 つの方法のいずれかで指定します。スタイルシートのプロパティの値に使用する際、 <angle> は次のように定義されています。

angle ::= number (~"deg" | ~"grad" | ~"rad")?

deg は度を示し、 grad はグラードを示し、 rad はラジアンを示します。

CSS2 で定義されたプロパティについては、角度単位の識別子を提供しなければなりません。 SVG 固有のプロパティとそれに対応するプレゼンテーション属性の角度値については、角度の単位識別子は省略可能です。提供しなかった場合、角度の値は度単位であるとみなされます。すべてのプロパティのプレゼンテーション属性において、定義されているのが SVG1.1 であるか CSS2 であるかに関わらず、角度の識別子を指定する場合は小文字でなければなりません。

SVG 属性で角度を指定する場合、 <angle> は以下のように定義されます。

angle ::= number ("deg" | "grad" | "rad")?

<angle> の単位の識別子は、すべて小文字でなければなりません。

SVG DOM 内での <angle> の値は SVGAngle (en-US) または SVGAnimatedAngle (en-US) を使用して表現されます。

基本データ型の <anything> は 0 個以上の文字の並びから構成されます。具体的には次の通りです。

anything ::= Char*

ここで Char は XML 1.0 , section 2.2 で定義されているとおり、文字を反映します。

時間値は SMIL アニメーション仕様と同じ構文です。時間値のための文法はここで繰り返されます。

Clock-val         ::= Full-clock-val | Partial-clock-val
                      | Timecount-val
Full-clock-val    ::= Hours ":" Minutes ":" Seconds ("." Fraction)?
Partial-clock-val ::= Minutes ":" Seconds ("." Fraction)?
Timecount-val     ::= Timecount ("." Fraction)? (Metric)?
Metric            ::= "h" | "min" | "s" | "ms"
Hours             ::= DIGIT+; any positive number
Minutes           ::= 2DIGIT; range from 00 to 59
Seconds           ::= 2DIGIT; range from 00 to 59
Fraction          ::= DIGIT+
Timecount         ::= DIGIT+
2DIGIT            ::= DIGIT DIGIT
DIGIT             ::= [0-9]

Timecount 値の既定値は "s" (秒) です。時計の値にはホワイトスペースを埋め込むことはできませんが、先頭と末尾のホワイトスペースは無視されます。

正規のクロック値の例は次の通りです。

• 完全な時間値:
  • 02:30:03 = 2 時間 30 分と 3 秒
  • 50:00:10.25 = 50 時間 10 秒と 250 ミリ秒
• 部分的な時間値:
  • 02:33 = 2 分 33 秒
  • 00:10.5 = 10.5 秒 = 10 秒と 500 ミリ秒
• 時間カウント値:
  • 3.2h = 3.2 時間 = 3 時間 12 分
  • 45min = 45 分
  • 30s = 30 秒
  • 5ms = 5 ミリ秒
  • 12.467 = 12 秒と 467 ミリ秒
• 小数値は、秒の（基数10の） 浮動小数点による定義です。したがって、
  • 00.5s = 500 ミリ秒
  • 00:00.005 = 5 ミリ秒

基本型 <color> は、 sRGB 色空間の色に対する CSS2 互換の仕様です。 <color> は SVG で color 属性を使用する場合に適用され、オプションで ICC ベースの色指定も用いる fill、stroke、stop-color、flood-color (en-US)、lighting-color (en-US) 属性の定義の部品です。

SVG は、 CSS2 の構文と基本データ型で定義されている、そして（実装に依存しますが）将来の CSS Color Module Level 3 で定義される、 <color> の構文の選択肢すべてに対応しています。

<color> はキーワードまたは数値による RGB の指定です。

これらの色キーワードに加えて、ユーザーは、ユーザー環境のオブジェクトが使用する色に対応するキーワードを指定することができます。このキーワードの規範的な定義は User preferences for colors (CSS2, section 18.2) にあります。

16 進数表記の RGB 値の形式は、 "#" の直後に 3 文字または 6 文字の 16 進数文字が続くものです。 3 桁の RGB 表記 (#rgb) は 0 を足すのではなく、数字を複製することで 6 桁の形式 (#rrggbb) に変換されます。例えば #fb0 は #ffbb00 に展開されます。これにより、白 (#ffffff) を短い表記 (#fff) で指定することができるようにし、ディスプレイの色深度への依存を防ぎます。関数記法での RGB 値の形式は、 RGB の開始関数の後に、 3 つの数値（3 つの整数値または 3 つのパーセント値）のカンマ区切りリストが続き、その後に ")" が続きます。 RGB 関数は、大文字小文字を区別しない文字列 "rgb(" を使います。例えば "RGB(" や "rGb(" でもかまいません。互換性のために、すべて小文字の "rgb(" を推奨します。整数値 255 は 100% に対応し、 16 進表記では F や FF に対応します。すなわち、 rgb(255 255 255) = rgb(100% 100% 100%) = #FFF です。数値の周りにはホワイトスペース文字を入れることができます。RGB 色はすべて sRGB 色空間で指定します。 sRGB を使用することで、曖昧さのない、客観的に測定可能な色の定義を提供し、国際標準と関連付けることができます。

color    ::= "#" hexdigit hexdigit hexdigit (hexdigit hexdigit hexdigit)?
              | "rgb("integer integer integer")"
              | "rgb("integer "%" integer "%" integer "%)"
              | color-keyword
hexdigit ::= [0-9A-Fa-f]

ここで color-keyword は、 CSS Color Module Level 3 に掲載されている色キーワードの一つ、または User preferences for colors (CSS2, section 18.2) に掲載されているシステム色キーワードの一つと (大文字と小文字を区別しないで) 一致します。

対応する SVG DOM インターフェイスは、 CSS で定義されているものを定義しています。 ICC ベースの色を指定する機能を含む SVG の色に対する拡張は、 DOM インターフェイス SVGColor を使用して表します。

<coordinate> は関連する軸に沿って (X 座標は X 軸に沿って、 Y 座標は Y 軸に沿って) ユーザー座標系の原点から所定の座標までの距離を指定します。その構文は <length> と同一です。

SVG DOM 内では、 <coordinate> の値は SVGLength (en-US) もしくは SVGAnimatedLength (en-US) で表現されます。

周波数値は、聴覚プロパティで使用します。 CSS2 での定義では、周波数値は <number> の直後に周波数単位識別子が続くものです。周波数単位識別子は次のとおりです。

• Hz: ヘルツ
• kHz: キロヘルツ

周波数値は負にすることができません。

参照するための関数記法。この参照の構文は CSS URI と同じです。

<integer> は省略可能な符号文字 (+ または -) の後、 1 桁以上の数字 0 から 9 を指定します。

integer ::= [+-]? [0-9]+

符号文字を示していない場合、数値は非負になります。

具体的な属性やプロパティにおいて別段の記載がない限り、 <integer> の範囲は（最小で） -2147483648 から 2147483647 までです。

SVG DOM 内では、 <integer> は number または SVGAnimatedInteger (en-US) として表現されます。

Internationalized Resource Identifier （国際化リソース識別子）です。

インターネットでは、リソースは IRI （国際化リソース識別子）を使用して識別されます。例えば、 http://example.com にある someDrawing.svg と呼ばれる SVG ファイルは以下のような IRI になります。

http://example.com/someDrawing.svg

IRI の一部として IRI フラグメント識別子を記載することで、IRI が XML 文書内の具体的な要素を指定することもできます。 IRI フラグメント識別子のある IRI は、オプションで IRI のベースとなる文字が続き、その後に "#" 文字が続き、その後に IRI フラグメント識別子が続きます。例えば、ファイル someDrawing.svg 内の "Lamppost" を ID とする要素を指定するには、次の IRI を使用することができます。

http://example.com/someDrawing.svg#Lamppost

IRI は href (en-US) 属性で使用します。 いくつかの属性は、 IRI と文字列の両方をコンテンツとして許します。相対 IRI と文字列が曖昧にならないように、関数記法 <FuncIRI> を使用します。これは関数記法で区切られた IRI です。メモ: 歴史的な理由から、区切り文字は CSS 仕様との互換性のために "url(" と ")" です。 FuncIRI 形式は、プレゼンテーション属性で使用します。

SVG は他のオブジェクトへの IRI 参照（絶対参照と相対参照の両方）を多用します。例えば、長方形を線形グラデーションで塗りつぶすには、最初に <linearGradient> 要素を定義し、それに ID を与えます。

<linearGradient xml:id="MyGradient">...</linearGradient>

次に、長方形の fill 属性の値として線形グラデーションを参照するには、次のようにします。

<rect fill="url(#MyGradient)" />

SVG は2種類の IRI 参照に対応しています。

• ローカル IRI 参照: IRI 参照は、<absoluteIRI> または <relativeIRI> を持たず、フラグメント識別子（#<elementID> または #xpointer(id<elementID>)）のみを持ちます。
• 非ローカル IRI 参照: IRI 参照が <absoluteIRI> または <relativeIRI> を持ちます。 SVG における IRI 参照の完全な仕様は、 SVG 1.1 (2nd Edition): IRI references を参照してください。

長さは距離の寸法です。数値とともに単位を提供します。 SVG2 仕様書では、この属性の構文と値について CSS <length> のデータ型と単位に合わせています。 長さの単位識別子を指定されなければならず、長さの単位識別子の値は大文字と小文字を区別しません。 構文は CSS の <length> の構文に従います。

length ::= <number> (<absolute-length> | <relative-length>)?

SVG1.1 で定義されている SVG 固有のプロパティと、それに対応するプレゼンテーション属性では、値の単位識別子は省略可能です。指定されなかった場合、長さの値は現在のユーザー座標系における距離を表します。長さ識別子は SVG で定義されようが CSS で定義されようが、すべてのプロパティのプレゼンテーション属性で使用する場合は小文字でなければなりません。この大文字小文字の区別は SVG2 では CSS と仕様を合わせるために緩和されています。

プロパティでない <length> の定義では、パーセント (%) 単位識別子も指定できることに注意し てください。 長さのパーセント値の意味は、長さのパーセント値が指定された属性によって異なります。よくあるケースは 2 つあります。

• パーセントの長さの値がビューポートの幅または高さの割合を表す場合
• パーセントの長さの値が、指定されたオブジェクトの外接ボックスの幅または高さの割合を表す場合。

SVG DOM 内では、 <length> の値はSVGLength (en-US) もしくは SVGAnimatedLength (en-US) で表現されます。

（ここで T は何らかの型です。）リストは区切られた一連の値から構成されます。明示的に異なる記述がない限り、 SVG の XML 属性内のリストはカンマ区切り（オプションでカンマの前後にホワイトスペースを含む）かホワイトスペース区切りのどちらかになります。

リスト内のホワイトスペースは、 "space" (U+0020), "tab" (U+0009), "line feed" (U+000A), "carriage return" (U+000D), and "form-feed" (U+000C) の 1 つ以上の連続した文字で定義します。

以下は EBNF 文法のテンプレートです。

list-of-Ts ::= T
                | T, list-of-Ts

SVG DOM 内では、 "List-of-Ts" 型の値は、具体的な型 T に固有のインターフェイスで表します。例えば、 SVG DOM 内では SVGLengthList (en-US) または SVGAnimatedLengthList (en-US) オブジェクトを使用して表します。

名前。文字列で、構文上意味のあるいくつかの文字が許されません。

name ::= [^,()#x20#x9#xD#xA] /* any char except ",", "(", ")" or wsp */

実数を指定する方法は 2 つあります。スタイルシートで使用する場合、実数は以下のように定義します。

number ::= integer
            | [+-]? [0-9]* "." [0-9]+

この構文は CSS の定義（CSS2、4.3.1 節）と同じです。

SVG属性で使用する場合、 <number> の定義は異なり、大きな数値をより簡潔に指定できるようにしています。

number ::= integer ([Ee] integer)?
            | [+-]? [0-9]* "." [0-9]+ ([Ee] integer)?

SVG DOM 内では <number> は浮動小数点で表され、 SVGNumber (en-US) または SVGAnimatedNumber (en-US) で表します。

2 つの <number> の組み合わせで、 2 番目の <number> は省略可能です。

number-optional-number ::= number
                            | number, number

SVG DOM では、 SVGAnimatedInteger (en-US) または SVGAnimatedNumber (en-US) オブジェクトのペアを使用して表します。

現在のオブジェクトが塗りつぶされている色やコンテンツの不透明度を数値で指定します。 0.0 （完全に透過）から 1.0 （完全に不透明）の範囲外の値はこの範囲に補正されます。

プロパティ fill と stroke の値は、指定されたグラフィック要素を塗りつぶしたり描画したりするときに使用する入力の型を定義します。 <paint> で利用できるオプションと構文は以下の通りです。

paint ::= none | <color> | <url> [none | <color>]? | context-fill | context-stroke

context-fill と context-stroke の値により、 marker (en-US) と use 要素の値を継承することができます。

SVG DOM 内では、 <paint> vの値は SVGPaint オブジェクトを使用して表します。

パーセント値は、数字に続く "%" 文字で指定します。

percentage ::= number "%"

スタイルシートと属性のどちらでパーセント値を指定するかによって、 <number> の定義が変わることに注意し てください。

パーセント値は常に別の値（例えば長さ）に対する相対値です。パーセント値を許容する各属性やプロパティは、パーセント値が参照する参照値も定義しています。

SVG DOM 内では、 SVGNumber (en-US) または SVGAnimatedNumber (en-US) オブジェクトを使用して表します。

時間は、 <number> の直後に時刻単位識別子が続きます。時刻単位識別子は次の通りです。

• ms: milliseconds
• s: seconds

<transform-list> 座標変換のリストを指定するために使用します。 <transform-list> で利用可能な値の詳細は transform 属性定義で指定されています。

SVG DOM 内では、 <transform-list> 値は SVGTransformList (en-US) または SVGAnimatedTransformList (en-US) オブジェクトを使用して表します。

Uniform Resource Locator （統一リソース指定子）です。

URL は Unicode 文字の並びで、内部または外部のリソースへのアドレスを構築します。

SVG 2 以前では URL の仕様が標準化されていなかったため、より制限の多い IRI データ型が代わりに使用されていました。