A SVG Micro DOM (uDOM)

目次

• A.1 概要
• A.2 SVG uDOM 概観
  • A.2.1 文書へのアクセス
  • A.2.2 木のナビゲーション
  • A.2.3 要素の作成
  • A.2.4 要素の挿入
  • A.2.5 要素の除去
  • A.2.6 属性とプロパティへのアクセス
  • A.2.7 イベントリスナの登録と除去
  • A.2.8 アニメーション
  • A.2.9 マルチメディア制御
  • A.2.10 Java パッケージの命名
• A.3 SVG uDOM への適合
  • A.3.1 浮動小数点数値
  • A.3.2 属性／プロパティの正規化
  • A.3.3 テキスト内容へのアクセス
• A.4 Module: dom
  • A.4.1 DOMException
  • A.4.2 Node
  • A.4.3 Element
  • A.4.4 Document
  • A.4.5 ElementTraversal
  • A.4.6 Location
  • A.4.7 Window
• A.5 Module: views
  • A.5.1 AbstractView
  • A.5.2 DocumentView
• A.6 Module: events
  • A.6.1 EventTarget
  • A.6.2 EventListener
  • A.6.3 Event
  • A.6.4 MouseEvent
  • A.6.5 MouseWheelEvent
  • A.6.6 TextEvent
  • A.6.7 KeyboardEvent
  • A.6.8 UIEvent
  • A.6.9 ProgressEvent
• A.7 Module: smil
  • A.7.1 ElementTimeControl
  • A.7.2 TimeEvent
• A.8 Module: svg
  • A.8.1 SVGException
  • A.8.2 SVGDocument
  • A.8.3 SVGUseElement
  • A.8.4 SVGElementInstance
  • A.8.5 SVGSVGElement
  • A.8.6 SVGRGBColor
  • A.8.7 SVGRect
  • A.8.8 SVGPoint
  • A.8.9 SVGPath
  • A.8.10 SVGMatrix
  • A.8.11 SVGLocatable
  • A.8.12 SVGLocatableElement
  • A.8.13 TraitAccess
  • A.8.14 Additional accessing rules
  • A.8.15 SVGElement
  • A.8.16 SVGTimedElement
  • A.8.17 SVGAnimationElement
  • A.8.18 SVGVisualMediaElement
  • A.8.19 SVGTimer
  • A.8.20 SVGGlobal
  • A.8.21 AsyncStatusCallback
  • A.8.22 AsyncURLStatus
  • A.8.23 EventListenerInitializer2

この付録は規定である。 This appendix is normative.

A.1 概要

SVG Mobile 1.1 仕様 [SVGM11] の近年の開発段階の中、実装の重荷を軽減するために SVG と XML DOM のサブセット化が必要なことが明らかになってきた。 SVG Tiny 1.2 では SVG Tiny の実装に相応しくありつつ必要な機能性が可能な限り得られる新しい特色機能を uDOM に盛り込む。 During the later stages of development of the SVG Mobile 1.1 specification [SVGM11] it became obvious that there was a requirement to subset the SVG and XML DOM in order to reduce the burden on implementations. SVG Tiny 1.2 adds new features to the uDOM, allowing for as much necessary functionality as possible, still being suitable for SVG Tiny implementations.

更に、 SVG Tiny 1.1 をサポートする機器には uDOM が実装可能な筈である。 この場合、（ SVG Tiny 1.1 はインラインスクリプトの利用をサポートしていないので）スクリプトは SVG 文書の外部の利用になるが。 Furthermore, it should be possible to implement the uDOM on devices that support SVG Tiny 1.1 although, in this case, the scripting would be external to the SVG document (since SVG Tiny 1.1 does not support inline scripting).

uDOM 定義の目標は、最も有用な SVG の特色機能（変換行列など）のみならず、従来の SVG DOM と比してインターフェースの数を減らし, 必要なコア XML DOM の特色機能を利用する実行時メモリ領域を節約するために、属性とプロパティの初期値と算出値へのアクセスを可能にする API を提供する所にある。 uDOM の（ SVG Tiny 1.1 に対応する）サブセットはすでに JSR 226: Scalable 2D Vector Graphics API for J2ME の様々な実装により、成功裏に実装されており、その互換性は uDOM [JSR226] のもう一つの目標になる。 The goal of the uDOM definition is to provide an API that allows access to initial and computed attribute and property values, to reduce the number of interfaces compared to the traditional SVG DOM, to reduce run-time memory footprint using necessary features of the core XML DOM, as well as the most useful SVG features (such as transformation matrices). A subset of the uDOM (corresponding to SVG Tiny 1.1) is already successfully implemented by various implementations of JSR 226: Scalable 2D Vector Graphics API for J2ME, compatibility with which is another goal of the uDOM [JSR226].

uDOM は DOM Level 2 Events [DOM2EVENTS] を規範として参照し, 参考として [DOM3EVENTS] を参照する。 DOM Level 3 Events は発行時点ではまだ勧告になっていないので、 uDOM には携帯機器に現在実装されているような機能を指定する DOM Level 3 Events の最小のサブセットが含められている。 DOM Level 3 Events には現在のウェブ環境のニーズを反映するように変更が加わることが予想され、その相反する変更は後の SVG 仕様においてここに指定される機能性に取って代わることになる。 The uDOM makes normative reference to DOM Level 2 Events [DOM2EVENTS], and informative reference to DOM Level 3 Events [DOM3EVENTS]. A minimal subset of DOM Level 3 Events was included in the uDOM to specify functionality as currently implemented on mobile devices, since DOM Level 3 Events was not yet a Recommendation at the time of publication. It is anticipated that DOM Level 3 Events may change to reflect the needs of the current Web environment, and any conflicting changes will supersede the functionality specified here for later SVG specifications.

uDOM の IDL 定義 が提供されている。 The IDL definition for the uDOM is provided.

この付録は次に挙げる部分から構成される： This appendix consists of the following parts:

• SVG uDOM 概観 — uDOM の参考概要。 サポートされる特色機能の要約および主要な特色機能と制約についての実例も伴う記述を含む。 Overview of the SVG uDOM — an informative introduction to the uDOM, including a summary of supported features and descriptions by topic of the key features and constraints together with examples.

• SVG uDOM への適合 — 主要な特色機能についての記述のみならず SVG uDOM への適合性基準を明記した、正式な節。 Conforming to the SVG uDOM — a normative section that states conformance criteria for the SVG uDOM as well as descriptions of key features.

• SVG uDOM （ DOM Core APIs, DOM Views APIs, SMIL DOM APIs, DOM Events APIs, SVG DOM APIs ）のすべてのインターフェースの正式な定義。 A normative definition of all the interfaces in the SVG uDOM (DOM Core APIs, DOM Views APIs, SMIL DOM APIs, DOM Events APIs and SVG DOM APIs).

A.2 SVG uDOM 概観

以下の節では、 SVG uDOM の主要な特色機能と制約の知識情報的概観を与える。 The following sections provides an informative overview of the SVG uDOM's key features and constraints.

注記：他の W3C DOM 定義同様、 SVG uDOM はプログラミング言語に依存しない。 この付録の例は ECMAScript と Java 言語のみからなるが、 SVG uDOM は他のプログラミング言語とも互換性がある。 Note: Like other W3C DOM definitions, the SVG uDOM is programming-language independent. Although this appendix only contains ECMAScript and Java language examples, the SVG uDOM is compatible with other programming languages.

A.2.1 文書へのアクセス

SVG uDOM は他の機能へのアクセスの起点になる Document オブジェクトへのアクセスを提供する。 Document オブジェクトが利用できるまでになる経緯は利用する文脈に依存する。 Java などの一部の言語では Document オブジェクトは EventListenerInitializer2 インターフェースの実装により得られる。 SVG-UA は一旦スクリプトが読み込まれて文書に結びつける準備が整い次第、実装の initializeEventListeners メソッドを呼び出す。 Document オブジェクトへは他の手段、例えば ECMAScript のグローバルオブジェクトに存在する AbstractView::document メンバを通してアクセスできる場合もある。 The SVG uDOM offers access to a Document object which is the root for accessing other features. The way the Document object becomes available depends on the usage context. In some languages, such as Java, the Document object can be obtained by implementing the EventListenerInitializer2 interface. The SVG user agent will invoke the implementation's initializeEventListeners method once the script has been loaded and is ready to bind to the document. The Document object is sometimes accessible through other means, for example through the AbstractView::document member which is available on the global object in ECMAScript.

A.2.2 木のナビゲーション

SVG uDOM では DOM 木のナビゲーションは文書ノードと要素ノードに対してのみ可能である。 要素階層のナビゲーションには２つの方法がある。 The SVG uDOM only allows navigation of the document node and the element nodes in the DOM tree. Two options are available for navigating the hierarchy of elements:

• ID 値を伴う個々の要素ノードは Document インターフェースの getElementById メソッドから直接アクセスできる。 Individual element nodes with an ID value are accessible directly via the getElementById method on the Document interface.
• 要素ノードの階層は Node インターフェースの parentNode 属性と ElementTraversal インターフェースの機能を利用して辿ることができる。 The hierarchy of element nodes are traversable using the facilities on the ElementTraversal interface, along with the parentNode attribute on the Node interface.

ElementTraversal インターフェースが提供する firstElementChild, lastElementChild, previousElementSibling, nextElementSibling [ET] は、とりわけ制約のある機器に適している。 これらのトラバースの仕組みは、空白のみからなるテキストノードなど、要素ノード間に割り込んでいるノードを飛ばす。 The ElementTraversal interface provides firstElementChild, lastElementChild, previousElementSibling and nextElementSibling, which are particularly suitable for constrained devices [ET]. These traversal mechanisms skip over intervening nodes between element nodes, such as text nodes which might only contain white space.

A.2.3 要素の作成

SVG uDOM では Document インターフェースの createElementNS メソッドを用いて新しい要素を作成できる。 The SVG uDOM allows the creation of new elements using the createElementNS method of the Document interface.

String svgNS = "http://www.w3.org/2000/svg";
Element myRect = document.createElementNS(svgNS, "rect");

A.2.4 要素の挿入

要素は親になる Node の appendChild または insertBefore メソッドを呼び出して文書木に挿入できる。 Elements can be inserted into the document tree by calling the appendChild or insertBefore methods on the Node that is to be the parent.

var svgNS = "http://www.w3.org/2000/svg";
// 新しい <rect> 要素を作成
var myRect = document.createElementNS(svgNS, "rect");
// 追加前に種々の <rect> プロパティを設定
...

// 要素を文書のルートに追加
var svgRoot = document.documentElement;
svgRoot.appendChild(myRect);

// 新しい <ellipse> 要素を作成
var myEllipse = document.createElementNS(svgNS, "ellipse");

// 挿入前に種々の <ellipse> プロパティを設定
...

// 矩形の前に楕円を挿入
svgRoot.insertBefore(myEllipse, myRect);

A.2.5 要素の除去

要素は親の Node の removeChild メソッドを呼び出して文書木から除去できる。 An element can be removed from the document tree by calling the removeChild method on its parent Node.

var myRect = ...;
var myGroup = document.getElementById("myGroup");
myGroup.appendChild(myRect);
...
myGroup.removeChild(myRect);

A.2.6 属性とプロパティへのアクセス

SVG Tiny 1.2 uDOM は XML 属性と CSS プロパティへアクセスする２つの方法をサポートする： Element インターフェースの getAttributeNS と setAttributeNS を用いる標準的な方法と traits と呼ばれる新しい概念による方法がある。 The SVG Tiny 1.2 uDOM supports two ways of accessing XML attributes and CSS properties; the standard way via getAttributeNS and setAttributeNS on the Element interface, and via a new concept called traits.

trait とは、 XML 属性や CSS プロパティを介して要素に結びつけられた、型付けされた値（例えば単なる文字列ではない数値など）である。 SVG uDOM における trait の機能は、一定の属性やプロパティ値への強く型付けされたアクセスを可能にする。 例えば、 getAttributeNS メソッドでは常に文字列が返されるのに比して getFloatTrait メソッドでは属性やプロパティの値を直接 float として取得する。 SVG uDOM の trait の機能は SVG 要素 を表現するすべての DOM オブジェクトに実装される TraitAccess インターフェースで利用できる。 A trait is the typed value (e.g. a number, not just a string), associated with an element by an XML attribute or a CSS property. The trait facilities in the SVG uDOM allow for strongly-typed access to certain attribute and property values. For example, there is a getFloatTrait method for getting an attribute or property value directly as a float, in contrast with the getAttributeNS method which always returns a string. The trait facilities in the SVG uDOM are available on the TraitAccess interface, which is implemented by all DOM objects representing SVG elements.

float width = myRect.getFloatTrait("width");
width += 10;
myRect.setFloatTrait("width", width);

（他のすべての trait ゲッタメソッドも併せて） getTraitNS と getAttributeNS の重要な違いは getTraitNS が属性の算出値を返すのに対し、 getAttributeNS は属性の指定値（ 属性／プロパティの正規化 で述べるように UA による値の正規化が生じ得るので、元の指定値と一致するとは限らない）を返す所にある。 An important difference between getTraitNS (along with all other trait getter methods) and getAttributeNS is that getTraitNS returns the computed attribute value but getAttributeNS returns the specified attribute value (which might not exactly match the original specified value due to the possibility of user agent value normalization as described in Attribute/property normalization).

<g fill="red">
  <rect id="r1" x="1" y="1" width="5" height="5"/>
  <rect id="r2" fill="inherit" x="1" y="1" width="5" height="5"/>
</g>

上の例で： In the above example:

• r1.getTraitNS(null, "fill") は "red" を返す（あるいは等価な正規化された形式の値を返す。 属性／プロパティの正規化 を見よ）。 r1.getTraitNS(null, "fill") returns "red" (or an equivalent normalized form, see Attribute/property normalization).
• r2.getTraitNS(null, "fill") も "red" を返す（あるいは等価な正規化された形式の値を返す。 属性／プロパティの正規化 を見よ）。 r2.getTraitNS(null, "fill") returns "red" (or an equivalent normalized form, see Attribute/property normalization).
• r1.getAttributeNS(null, "fill") は "" を返す。 r1.getAttributeNS(null, "fill") returns "".
• r2.getAttributeNS(null, "fill") は "inherit" を返す。 r2.getAttributeNS(null, "fill") returns "inherit".

trait のアニメーションも underlying XML 属性または プロパティ への適用により可能である。 trait のアニメーション値へのアクセスには、 TraitAccess インターフェースの getPresentationTrait が（他の類似する名前の presentation trait ゲッタメソッドも同様に）利用できる。 Traits may also be animated, by animating the underlying XML attribute or property. To access the animated value of a trait, the getPresentationTrait, along with the other similarly named presentation trait getter methods on the TraitAccess interface, can be used.

A.2.7 イベントリスナの登録と除去

SVG uDOM は DOM Level 2 Events の EventTarget インターフェースを利用して文書ノードへのイベントリスナの登録と除去をサポートする。 The SVG uDOM utilizes DOM Level 2 Events, using the EventTarget interface, to support the ability to add and remove event listeners to nodes in a document.

class MyEventListener implements EventListener {
    public void handleEvent(Event evt) {
        // ここに必要なコードを置く
    }
}
...

// リスナを作成
EventListener listen1 = new MyEventListener();

// 浮上過程の click イベントをリッスン
SVGElement myRect = (SVGElement)document.getElementById("myRect");
myRect.addEventListener("click", listen1, false);
...

// click リスナを除去
myRect.removeEventListener("click", listen1, false);

A.2.8 アニメーション

ElementTimeControl インターフェースのメソッドを用いて アニメーション要素 の始動と停止を行える。 Animation elements can be started and stopped using the methods available on the ElementTimeControl interface.

var animateColor = document.getElementById("myAnimation");

// 2.5 秒後にアニメーションを始動させる。
animateColor.beginElementAt(2.5);

A.2.9 マルチメディア制御

ElementTimeControl と SVGTimedElement インターフェースを組み合わせて audio, video, animation 要素などのマルチメディア要素を制御できる。 一般的な制御の一部とアクセスするインターフェースメソッドを下に示す： Control of multimedia elements, such as the 'audio', 'video', and 'animation' elements is available through a combination of the ElementTimeControl and SVGTimedElement interfaces. Some common controls, and the interface methods to access them, are listed below:

• 再生： ElementTimeControl インターフェースの beginElement メソッド play: beginElement method of the ElementTimeControl interface
• 停止： ElementTimeControl インターフェースの endElement メソッド stop: endElement method of the ElementTimeControl interface
• 一時停止： SVGTimedElement インターフェースの pauseElement メソッド pause: pauseElement method of the SVGTimedElement interface
• 再開： SVGTimedElement インターフェースの resumeElement メソッド unpause: resumeElement method of the SVGTimedElement interface
• 移行： ElementTimeControl インターフェースの beginElementAt メソッド （例えばビデオの時間軸を棒線グラフィックで表現し、棒線の click イベントの地点が動画の新たな開始時刻への時間差を与えるようにするなど）。 seek: beginElementAt method of the ElementTimeControl interface (for example, a line graphic could be used to represent the timeline of a video, and a click event on a certain point on the line could serve as the offset for the new begin time of the video).

SVG 1.2 Tiny は時間コンテナ要素に対する（早送りや早戻しなどの）再生速度の制御は定めていないことに注意。 この機能性は将来版に含められるものと見込まれている。 Note that SVG 1.2 Tiny does not define controlling the rate of playback (such as fast-forward or reverse) for time container elements. This functionality may be included in a future specification.

A.2.10 Java パッケージの命名

SVG uDOM の Java パッケージ名は来るべき SVG 1.2 Full DOM のものと同じである（ org.w3c.dom, org.w3c.dom.events, org.w3c.dom.svg, 等々）。 これにより、特色機能を SVG uDOM に制限した Java アプリケーションでも SVG 1.2 Full DOM をサポートする実装で実行可能になる。 The SVG uDOM uses the same Java package names as the upcoming SVG 1.2 Full DOM (e.g. org.w3c.dom, org.w3c.dom.events, org.w3c.dom.svg). This allows Java applications which restrict themselves to the features in the SVG uDOM to also run in implementations that support the SVG 1.2 Full DOM.

A.3 SVG uDOM への適合

この節と以下のすべては正式なものになる。 適合 SVG ビューアは、インターフェースが明示的にこの規則の例外を認めている部分以外は、 SVG uDOM で定義されたすべてのインターフェースのすべての内容, 属性, メソッドをサポートしなければならない。 This section and all the following are normative. Conforming SVG Viewers must support all constants, attributes and methods of all the interfaces defined in the SVG uDOM unless an interface explicitly allows for exceptions to this rule.

A.3.1 浮動小数点数値

SVG uDOM では IDL の float 値を IEEE-754 単精度浮動小数点値 [IEEE-754] で表現する。 非有限数値 — NaN （ Not a Number ）値のセットと正と負の無限大 — これらの値は uDOM では決して用いられない。 従って、処理または属性について特別に注釈が記されている場合を除き、非有限値が処理の引数として渡されたり, float 型の属性に代入されたり, 非有限値を含む浮動小数点値の配列が sequence<float> 型の処理引数や属性に渡された場合、エラーコード NOT_SUPPORTED_ERR の DOMException が投げられなければならない。 The SVG uDOM uses IEEE-754 single precision floating point values to represent float values in the IDL [IEEE-754]. While such values support a number of non-finite values — a set of NaN (Not a Number) values and positive & negative infinity — these values are never used by the uDOM. Thus, unless otherwise specified in the prose for an operation or attribute, a DOMException with error code NOT_SUPPORTED_ERR must be thrown if a non-finite value is passed as an operation argument, or assigned to an attribute, whose type is float, or if a list of floating point values containing a non-finite value is passed as an operation argument, or assigned to an attribute, whose type is sequence<float>.

加えて、 uDOM のすべての処理と属性は正と負のゼロを区別しない。 負のゼロが float または sequence<float> 型の処理引数に渡されたりその型の属性に代入される際には正のゼロとして扱わなければならない。 In addition, none of the operations or attributes in the uDOM distinguish between positive and negative zero. A negative zero must be treated as a positive zero when passed as an operation argument, or assigned to an attribute, whose type is float or sequence<float>.

uDOM の処理および属性は決して非有限値または負のゼロ値を返さない。 Operations and attributes in the uDOM will never return a non-finite or negative zero value from an operation or attribute.

A.3.2 属性／プロパティの正規化

uDOM を実装するビューアは、 getAttributeNS メソッド, 種々の trait ゲッタメソッド（ getTrait, getTraitNS, getFloatTrait , 等々）, trait 表示値ゲッタメソッド（ getPresentationTrait, getPresentationTraitNS, getFloatPresentationTrait , 等々）から 正規化された属性値 ([DOM3], 1.4 節) を返してもよい。 行い得る属性の正規化の一覧を以下に挙げる:
【表示値（ presentation value ）= アニメーション値（表示中の値）と思われる】 A viewer implementing the uDOM is allowed to return normalized attribute values ([DOM3], section 1.4) from getAttributeNS and the various trait getter methods (getTrait, getTraitNS, getFloatTrait, etc.) and trait presentation value getter methods (getPresentationTrait, getPresentationTraitNS, getFloatPresentationTrait, etc.). The following is a list of possible attribute normalizations:

色の正規化

"red" は "rgb(255,0,0)", "#ff0000", または他の同一の意味内容の形式で返してもよい。 "red" may be returned as "rgb(255,0,0)", "#ff0000", or another semantically identical form.

範囲外の値の正規化

一定の範囲内でのみ妥当な値はその範囲に切り上げ／下げられた値にして返してもよい。 例えば fill-opacity="1.3" は "1" を返してもよい。 Values that are only of relevance within a certain range may be returned as a value clamped to that range. E.g. fill-opacity="1.3" may be returned as "1".

数値精度

"3.0" は "3" でも "3.00" でも、他の同一の意味内容の形式で返してもよい。 "3.0" may be returned as "3", "3.00" or another semantically identical form.

空白の正規化

" 3.0 " は "3.0" を返してもよい。 空白の正規化には font-family プロパティ内の引用符で括られていないフォント名も含まれる。 空白を含むフォントファミリ名は引用符で括られるべきである。 引用符が省略された場合、フォント名の前後の空白は無視され、途中にある連続する空白文字は１個のスペースに置換されてもよい。 " 3.0 " may be returned as "3.0". Whitespace normalization also includes unquoted font names in the 'font-family' property. Font family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the font name may be ignored and any sequence of whitespace characters inside the font name may be converted to a single space.

フォントウェイトの正規化

"normal" は "400" を返してもよく, "bold" は "700" を返してもよい。 "normal" may be returned as "400", "bold" may be returned as "700".

変換の正規化

座標系変換値は対応する行列を返してもよい。 例えば "scale(2,2)" は "matrix(2,0,0,2,0,0)" を返してもよく, "scale(2,2) translate(10,5) rotate(45)" は "matrix(1.4142, 1.4142, -2.5857, 1.4142, 20, 10)" を返してもよい。 Any transform value may be returned as the corresponding matrix. E.g. "scale(2,2)" may be returned as "matrix(2,0,0,2,0,0)", and "scale(2,2) translate(10,5) rotate(45)" may be returned as "matrix(1.4142, 1.4142, -2.5857, 1.4142, 20, 10)".

パスの正規化

d と path で利用されるパスデータ命令のフルセットはより小さなセットに整理されてもよい。 The full set of path data comamnds as used by 'd' and 'path' may be mapped down to a smaller set of commands.

• 相対命令（ c, h, l, m, q, s, t, v, z ）は絶対版へ変換。 Relative commands (c, h, l, m, q, s, t, v, and z) are converted to their absolute counterparts.
• 水平および垂直の線分（ H, h, V, v ）は一般の線分（ L, l ）へ変換。 Horizontal and Vertical lines (H, h, V, and v) are converted to general lines (L and l).
• 命令 S は命令 C へ変換。 Translate command S to command C.
• 命令 T は命令 C へ変換。 Translate command T to command C.
• パスの連結前に暗黙の lineto が追加されている場合でも、命令 Z は常に命令 Z に正規化。 A command Z is always normalized to command Z, even in the cases where an implicit lineto is added before the path is joined.

display の正規化

display に可能な値はすべて 'none', 'inline', 'inherit' いずれかに正規化してよい。 純粋な SVG Tiny 1.2 ビューアであれば、これらの値で display の出力として可能な様態をまかなえるので。 例えば "block" は "inline" を返してもよい。 例えば CDF ビューアなど複数名前空間を扱う場合では display プロパティの差異が重要になるので、複数の名前空間の環境下での利用が意図されている SVG Tiny 1.2 ビューアには、全範囲の display 値の維持が強く推奨される。 All possible 'display' values may be mapped to 'none', 'inline' or 'inherit' since they cover all the possible 'display' outputs for a pure SVG Tiny 1.2 viewer. For example, "block" may be returned as "inline". For viewers in multiple namespaces, e.g. a CDF viewer, the different 'display' properties are of importance and therefore an SVG Tiny 1.2 viewer intended for use in a multiple namespace environment is strongly recommended to keep the full range of 'display' values.

A.3.3 テキスト内容へのアクセス

SVG uDOM による要素のテキスト内容へのアクセスには２通りの方法がある。 TraitAccess インターフェースを通したテキストへのアクセスはすべての SVGElement で利用できる。 これは SVG Tiny 1.1 uDOM でも利用できていたもので（ JSR 226 仕様 [JSR226] で利用されている）下位互換性を保つため、依然利用できる。 SVG Tiny 1.2 uDOM の仕様では、より汎用的なテキストアクセスの仕組みとして Node インターフェースに textContent 属性を導入する。 In the SVG uDOM, there are two alternative ways to access an element's textual content. Text access via the TraitAccess interface is available on all SVGElements. This was available in the SVG Tiny 1.1 uDOM (used in the JSR 226 specification [JSR226]) and is still available in order to keep backward compability. The SVG Tiny 1.2 uDOM specification introduces the textContent attribute on the Node interface as a more generic text access mechanism.

要素のテキスト文字列値へ trait を通してアクセスするには、その要素の getTrait() または setTrait() を呼び出す際に、引数の取得または設定する trait 名を #text にする。 例えば、 MyTextElement.setTrait("#text", "Hello"); など。 テキスト内容要素 および desc, title, metadata 要素は #text の仕組みを通したテキストへのアクセスをサポートしなければならない。 この仕様で定義されている他の要素（ 要素 一覧を見よ）では、テキストへのアクセスはサポートされない。 また、実装はそれらの要素のテキストを無視すべきである。 To access or set the text string value for an element via traits you invoke getTrait() or setTrait() on that element and pass #text as the name of the trait you want to get or set. For example, MyTextElement.setTrait("#text", "Hello"); Text access via the #text mechanism must be supported on text content, 'desc', 'title' and 'metadata' elements. Text access to other elements defined within this specification (see list of elements) is not supported and an implementation should ignore any text on these elements.

#text の仕組みを通したテキスト内容の取得と設定の結果は textContent 属性を用いた場合と同一になる。 従って利用者は、要素からテキスト文字列を取得して設定し直した場合に子の tspan 要素（すなわち、テキスト内容を取得する要素の子の tspan 要素）のスタイル付けが失われることに留意すべきである。 The result of getting and setting text content via the #text mechanism is exactly the same as when using the textContent attribute. Therefore the user should be aware of the fact that styling by child 'tspan' elements (i.e. 'tspan' elements that are children of the element which text content is retrieved) will be lost if a text string is retrieved from an element and then set back again.

#text trait は JSR 226 仕様 [JSR226] との互換性のために含められている。 内容製作者は JSR 226 実装との互換性が要求されていない所では、適用性がより汎用的かつ DOM Level 3 Core [DOM3] との互換性サポートもより良い textContent を代わりに用いることが推奨される。 The #text trait is included for compatibility with the JSR 226 specification [JSR226]. It is recommended that where compatibility with JSR 226 implementations is not required content developers use textContent instead as it is more generally applicable and supports better compatibility with DOM Level 3 Core [DOM3].

A.4 Module: dom

A.4.1 DOMException

A.4.2 Node

A.4.3 Element

A.4.4 Document

A.4.5 ElementTraversal

A.4.6 Location

A.4.7 Window

A.5 Module: views

SVG Tiny 1.2 では AbstractView と DocumentView インターフェース [DOM2VIEWS] を含む DOM Level 2 Views の完全なサポートが要求される。 SVG Tiny 1.2 requires complete DOM Level 2 Views support, which includes the AbstractView and DocumentView interfaces [DOM2VIEWS].

SVG Tiny 1.2 uDOM は文書のデフォルトビュー以外のビューへのアクセスは提供しない。 デフォルトビューへは DocumentView::defaultView を通してアクセスできる。 デフォルトビューには SVGGlobal インターフェースの実装も要求されることに注意。 ECMAScript 言語束縛においては、グローバルスクリプトオブジェクトがデフォルトビューも表現するオブジェクトでなければならない。 The SVG Tiny 1.2 uDOM does not provide access to any views of the document other than the default view. The default view is accessible through DocumentView::defaultView. Note that the default view is required to also implement the SVGGlobal interface. In the ECMAScript language binding, the global script object must also be the object that represents the default view.

A.5.1 AbstractView

A.5.2 DocumentView

A.6 Module: events

A.6.1 EventTarget

A.6.2 EventListener

A.6.3 Event

A.6.4 MouseEvent

A.6.5 MouseWheelEvent

A.6.6 TextEvent

A.6.7 KeyboardEvent

キー識別子セット

これは DOM Level 3 Events, ([DOM3EVENTS], A.2 節) で定義されている キー識別子 のサブセットであり、現在携帯機器に実装されている機能のスナップショットを定める。 This is a subset of the key identifiers defined in DOM Level 3 Events, and defines a snapshot of functionality currently implemented on mobile devices ([DOM3EVENTS], section A.2).

この節に含まれるキー識別子の一覧は完全なものではなく、入力装置が独自のキー識別子を定義する必要も生じ得る。 DOM Level 3 Events ではどのキー識別子を用いるかを決定するアルゴリズムが定義されることが予期されている。 将来版の SVG 仕様ではキーボードイベントとキー識別子の確実な扱いについては DOM Level 3 Events を待つことになる。 The list of key identifiers contained in this section is not exhaustive and input devices may have to define their own key identifiers. It is expected that DOM Level 3 Events will define an algorithm to determine which key identifier to use. Future SVG specifications will defer to DOM Level 3 Events for a definitive treatment of keyboard events and key identifiers.

"U+0000", "U+0001", ..., "U+10FFFF" は Unicode [UNICODE] を基にしたキー識別子になる。 UA はキー識別の目的においては内容に含まれる文字列リテラルを Unicode 符号位置として扱ってもよい。 "U+0000", "U+0001", ..., "U+10FFFF" are Unicode-based key identifiers [UNICODE]. A user agent may treat string literal characters in content as Unicode codepoints for the purpose of key identification.

"Accept"

確定（ Commit, OK ）キー The Accept (Commit, OK) key.

"Again"

Again キー The Again key.

"AllCandidates"

全候補キー The All Candidates key.

"Alphanumeric"

英数キー The Alphanumeric key.

"Alt"

Alt （ Menu ）キー The Alt (Menu) key.

"AltGraph"

Alt-Graph キー The Alt-Graph key.

"Apps"

Application キー The Application key.

"Attn"

ATTN キー The ATTN key.

"BrowserBack"

ブラウザ後退キー The Browser Back key.

"BrowserFavorites"

ブラウザお気に入りキー The Browser Favorites key.

"BrowserForward"

ブラウザ前進キー The Browser Forward key.

"BrowserHome"

ブラウザ Home キー The Browser Home key.

"BrowserRefresh"

ブラウザ更新キー The Browser Refresh key.

"BrowserSearch"

ブラウザ検索キー The Browser Search key.

"BrowserStop"

ブラウザ中止キー The Browser Stop key.

"CapsLock"

大文字ロックキー The Caps Lock (Capital) key.

"Clear"

Clear キー The Clear key.

"CodeInput"

コード入力（漢字番号入力）キー The Code Input key.

"Compose"

Compose キー The Compose key.

"Control"

コントロール (Ctrl) キー The Control (Ctrl) key.

"Crsel"

Crsel キー The Crsel key.

"Convert"

変換キー The Convert key.

"Copy"

コピーキー The Copy key.

"Cut"

カットキー The Cut key.

"Down"

下矢印キー The Down Arrow key.

"DownLeft"

左斜め下矢印キー The diagonal Down-Left Arrow key.

"DownRight"

右斜め下矢印キー The diagonal Down-Right Arrow key.

"End"

End キー The End key.

"Enter"

Enter キー 注記： このキー識別子は Return キー（ Macintosh テンキー ）にも用いられる。 The Enter key. Note: This key identifier is also used for the Return (Macintosh numpad) key.

"EraseEof"

Erase EOF キー The Erase EOF key.

"Execute"

Execute キー The Execute key.

"Exsel"

Exsel キー The Exsel key.

"F1"

F1 キー The F1 key.

"F2"

F2 キー The F2 key.

"F3"

F3 キー The F3 key.

"F4"

F4 キー The F4 key.

"F5"

F5 キー The F5 key.

"F6"

F6 キー The F6 key.

"F7"

F7 キー The F7 key.

"F8"

F8 キー The F8 key.

"F9"

F9 キー The F9 key.

"F10"

F10 キー The F10 key.

"F11"

F11 キー The F11 key.

"F12"

F12 キー The F12 key.

"F13"

F13 キー The F13 key.

"F14"

F14 キー The F14 key.

"F15"

F15 キー The F15 key.

"F16"

F16 キー The F16 key.

"F17"

F17 キー The F17 key.

"F18"

F18 キー The F18 key.

"F19"

F19 キー The F19 key.

"F20"

F20 キー The F20 key.

"F21"

F21 キー The F21 key.

"F22"

F22 キー The F22 key.

"F23"

F23 キー The F23 key.

"F24"

F24 キー The F24 key.

"FinalMode"

Final モード（ Final ）キー。一部のアジア圏のキーボードで用いられている。 The Final Mode (Final) key used on some asian keyboards.

"Find"

Find キー The Find key.

"FullWidth"

全角文字キー The Full-Width Characters key.

"HalfWidth"

半角文字キー The Half-Width Characters key.

"HangulMode"

ハングル（韓国・朝鮮の文字）モードキー The Hangul (Korean characters) Mode key.

"HanjaMode"

ハンジャ（韓国・朝鮮の文字）モードキー The Hanja (Korean characters) Mode key.

"Help"

ヘルプキー The Help key.

"Hiragana"

平仮名（日本の仮名文字）キー The Hiragana (Japanese Kana characters) key.

"Home"

ホームキー The Home key.

"Insert"

挿入（ Ins ）キー The Insert (Ins) key.

"JapaneseHiragana"

日本語平仮名キー The Japanese-Hiragana key.

"JapaneseKatakana"

日本語片仮名キー The Japanese-Katakana key.

"JapaneseRomaji"

日本語ローマ字キー The Japanese-Romaji key.

"JunjaMode"

Junja モードキー The Junja Mode key.

"KanaMode"

仮名モード（仮名ロック）キー The Kana Mode (Kana Lock) key.

"KanjiMode"

漢字（中国起源の表意文字の日本名）モードキー The Kanji (Japanese name for ideographic characters of Chinese origin) Mode key.

"Katakana"

片仮名（日本語仮名文字）キー The Katakana (Japanese Kana characters) key.

"LaunchApplication1"

アプリケーション１開始キー The Start Application One key.

"LaunchApplication2"

アプリケーション２開始キー The Start Application Two key.

"LaunchMail"

メール開始キー The Start Mail key.

"Left"

左矢印キー The Left Arrow key.

"Menu"

Menu キー The Menu key.

"Meta"

メタキー The Meta key.

"MediaNextTrack"

メディア次トラックキー The Media Next Track key.

"MediaPlayPause"

メディア再生・一時停止キー The Media Play Pause key.

"MediaPreviousTrack"

メディア前トラックキー The Media Previous Track key.

"MediaStop"

メディア停止キー The Media Stop key.

"ModeChange"

モード変更キー The Mode Change key.

"Nonconvert"

無変換（変換しない）キー The Nonconvert (Don't Convert) key.

"NumLock"

数字ロックキー The Number Lock key.

"PageDown"

Page Down（次頁）キー The Page Down (Next) key.

"PageUp"

Page Up キー The Page Up key.

"Paste"

ペーストキー The Paste key.

"Pause"

ポーズキー The Pause key.

"Play"

再生キー The Play key.

"PreviousCandidate"

前候補機能キー The Previous Candidate function key.

"PrintScreen"

プリントスクリーン（ PrintScrn, SnapShot ）キー The Print Screen (PrintScrn, SnapShot) key.

"Process"

Process キー The Process key.

"Props"

Props キー The Props key.

"Right"

右矢印キー The Right Arrow key.

"RomanCharacters"

ローマ字機能キー The Roman Characters function key.

"Scroll"

スクロールロックキー The Scroll Lock key.

"Select"

選択キー The Select key.

"SelectMedia"

メディア選択キー The Select Media key.

"Shift"

シフトキー The Shift key.

"Soft1"

Soft1 キー The Soft1 key.

"Soft2"

Soft2 キー The Soft2 key.

"Soft3"

Soft3 キー The Soft3 key.

"Soft4"

Soft4 キー The Soft4 key.

"Stop"

停止キー The Stop key.

"Up"

上矢印キー The Up Arrow key.

"UpLeft"

左斜め上矢印キー The diagonal Up-Left Arrow key.

"UpRight"

右斜め上矢印キー The diagonal Up-Right Arrow key.

"Undo"

Undo キー The Undo key.

"VolumeDown"

音量減少キー The Volume Down key.

"VolumeMute"

無音キー The Volume Mute key.

"VolumeUp"

音量増大キー The Volume Up key.

"Win"

Windows ロゴキー The Windows Logo key.

"Zoom"

ズームキー The Zoom key.

"U+0008"

Backspace (Back) キー The Backspace (Back) key.

"U+0009"

水平タブ（ Tab ）キー The Horizontal Tabulation (Tab) key.

"U+0018"

キャンセルキー The Cancel key.

"U+001B"

エスケープ（ Esc ）キー The Escape (Esc) key.

"U+0020"

スペース（スペースバー）キー The Space (Spacebar) key.

"U+0021"

感嘆符（ Factorial, Bang ）キー（ ! ） The Exclamation Mark (Factorial, Bang) key (!).

"U+0022"

引用符号（２重引用符）キー（ " ） The Quotation Mark (Quote Double) key (").

"U+0023"

番号記号（ポンド記号, ハッシュマーク, クロスハッチ, オクトソープ）キー（ # ） The Number Sign (Pound Sign, Hash, Crosshatch, Octothorpe) key (#).

"U+0024"

ドル記号（ milreis, escudo ）キー（ $ ） The Dollar Sign (milreis, escudo) key ($).

"U+0026"

アンパサンドキー（ & ） The Ampersand key (&).

"U+0027"

アポストロフィ（ Apostrophe-Quote, APL Quote ）キー（ ' ） The Apostrophe (Apostrophe-Quote, APL Quote) key (').

"U+0028"

左括弧（開き括弧）キー（ ( ） The Left Parenthesis (Opening Parenthesis) key (().

"U+0029"

右括弧（閉じ括弧）キー（ ) ） The Right Parenthesis (Closing Parenthesis) key ()).

"U+002A"

アスタリスク（ Star ）キー（ * ） The Asterisk (Star) key (*).

"U+002B"

プラス符号（ Plus ）キー（ + ） The Plus Sign (Plus) key (+).

"U+0025"

パーセント符号（Percent）キー（ + ） The Percent Sign (Percent) key (+).

"U+002C"

コンマ符号（ decimal separator ）キー（ , ） The Comma (decimal separator) sign key (,).

"U+002D"

ハイフン-マイナス（ハイフンまたはマイナス符号）キー（ - ） The Hyphen-minus (hyphen or minus sign) key (-).

"U+002E"

Full Stop（ピリオド, ドット, 小数点）キー（ . ） The Full Stop (period, dot, decimal point) key (.).

"U+002F"

斜線（スラッシュ, 斜線, シリング）キー（ / ） The Solidus (slash, virgule, shilling) key (/).

"U+0030"

数字 0 キー（ 0 ） The Digit Zero key (0).

"U+0031"

数字 1 キー（ 1 ） The Digit One key (1).

"U+0032"

数字 2 キー（ 2 ） The Digit Two key (2).

"U+0033"

数字 3 キー（ 3 ） The Digit Three key (3).

"U+0034"

数字 4 キー（ 4 ） The Digit Four key (4).

"U+0035"

数字 5 キー（ 5 ） The Digit Five key (5).

"U+0036"

数字 6 キー（ 6 ） The Digit Six key (6).

"U+0037"

数字 7 キー（ 7 ） The Digit Seven key (7).

"U+0038"

数字 8 キー（ 8 ） The Digit Eight key (8).

"U+0039"

数字 9 キー（ 9 ） The Digit Nine key (9).

"U+003A"

コロンキー（ : ） The Colon key (:).

"U+003B"

セミコロンキー（ ; ） The Semicolon key (;).

"U+003C"

小なり記号キー（ < ） The Less-Than Sign key (<).

"U+003D"

等号キー（ = ） The Equals Sign key (=).

"U+003E"

大なり記号キー（ > ） The Greater-Than Sign key (>).

"U+003F"

疑問符キー（ ? ） The Question Mark key (?).

"U+0040"

単価符号キー（ @ ） The Commercial At (@) key.

"U+0041"

ラテン大文字 A キー（ A ） The Latin Capital Letter A key (A).

"U+0042"

ラテン大文字 B キー（ B ） The Latin Capital Letter B key (B).

"U+0043"

ラテン大文字 C キー（ C ） The Latin Capital Letter C key (C).

"U+0044"

ラテン大文字 D キー（ D ） The Latin Capital Letter D key (D).

"U+0045"

ラテン大文字 E キー（ E ） The Latin Capital Letter E key (E).

"U+0046"

ラテン大文字 F キー（ F ） The Latin Capital Letter F key (F).

"U+0047"

ラテン大文字 G キー（ G ） The Latin Capital Letter G key (G).

"U+0048"

ラテン大文字 H キー（ H ） The Latin Capital Letter H key (H).

"U+0049"

ラテン大文字 I キー（ I ） The Latin Capital Letter I key (I).

"U+004A"

ラテン大文字 J キー（ J ） The Latin Capital Letter J key (J).

"U+004B"

ラテン大文字 K キー（ K ） The Latin Capital Letter K key (K).

"U+004C"

ラテン大文字 L キー（ L ） The Latin Capital Letter L key (L).

"U+004D"

ラテン大文字 M キー（ M ） The Latin Capital Letter M key (M).

"U+004E"

ラテン大文字 N キー（ N ） The Latin Capital Letter N key (N).

"U+004F"

ラテン大文字 O キー（ O ） The Latin Capital Letter O key (O).

"U+0050"

ラテン大文字 P キー（ P ） The Latin Capital Letter P key (P).

"U+0051"

ラテン大文字 Q キー（ Q ） The Latin Capital Letter Q key (Q).

"U+0052"

ラテン大文字 R キー（ R ） The Latin Capital Letter R key (R).

"U+0053"

ラテン大文字 S キー（ S ） The Latin Capital Letter S key (S).

"U+0054"

ラテン大文字 T キー（ T ） The Latin Capital Letter T key (T).

"U+0055"

ラテン大文字 U キー（ U ） The Latin Capital Letter U key (U).

"U+0056"

ラテン大文字 V キー（ V ） The Latin Capital Letter V key (V).

"U+0057"

ラテン大文字 W キー（ W ） The Latin Capital Letter W key (W).

"U+0058"

ラテン大文字 X キー（ X ） The Latin Capital Letter X key (X).

"U+0059"

ラテン大文字 Y キー（ Y ） The Latin Capital Letter Y key (Y).

"U+005A"

ラテン大文字 Z キー（ Z ） The Latin Capital Letter Z key (Z).

"U+005B"

左角括弧（開き角括弧）キー（ [ ） The Left Square Bracket (Opening Square Bracket) key ([).

"U+005C"

逆斜線（バックスラッシュ）キー（ \ ） The Reverse Solidus (Backslash) key (\).

"U+005D"

右角括弧（閉じ角括弧）キー（ ] ） The Right Square Bracket (Closing Square Bracket) key (]).

"U+005E"

サーカムフレックスキー（ ^ ） The Circumflex Accent key (^).

"U+005F"

ロー記号（スペーシングアンダースコア, アンダースコア）キー（ _ ） The Low Sign (Spacing Underscore, Underscore) key (_).

"U+0060"

グレイヴ・アクセント（バッククォート）キー（ ` ） The Grave Accent (Back Quote) key (`).

"U+007B"

左波括弧（開きカーリーブラケット, 開きブレイス, 左ブレイス）キー（ { ） The Left Curly Bracket (Opening Curly Bracket, Opening Brace, Brace Left) key ({).

"U+007C"

縦線（縦棒、パイプ）キー（ | ） The Vertical Line (Vertical Bar, Pipe) key (|).

"U+007D"

右波括弧（閉じカーリーブラケット, 閉じブレイス, 右ブレイス）キー（ { ） The Right Curly Bracket (Closing Curly Bracket, Closing Brace, Brace Right) key (}).

"U+007F"

削除（ Del ）キー The Delete (Del) Key.

"U+00A1"

反転感嘆符号キー（ ¡ ） The Inverted Exclamation Mark key (¡).

"U+0300"

結合グレイヴアクセント（ Greek Varia, Dead Grave ）キー The Combining Grave Accent (Greek Varia, Dead Grave) key.

"U+0301"

結合鋭アクセント（ Stress Mark, Greek Oxia, Tonos, Dead Eacute ）キー The Combining Acute Accent (Stress Mark, Greek Oxia, Tonos, Dead Eacute) key.

"U+0302"

結合サーカムフレックス・アクセント（ Hat, Dead Circumflex ）キー The Combining Circumflex Accent (Hat, Dead Circumflex) key.

"U+0303"

結合チルダ（ Dead Tilde ）キー The Combining Tilde (Dead Tilde) key.

"U+0304"

結合長音記号（ Long, Dead Macron ）キー The Combining Macron (Long, Dead Macron) key.

"U+0306"

結合単音記号（ Short, Dead Breve ）キー The Combining Breve (Short, Dead Breve) key.

"U+0307"

結合上点（ Derivative, Dead Above Dot ）キー The Combining Dot Above (Derivative, Dead Above Dot) key.

"U+0308"

結合分音符（ Double Dot Abode, Umlaut, Greek Dialytika, Double Derivative, Dead Diaeresis ）キー The Combining Diaeresis (Double Dot Above, Umlaut, Greek Dialytika, Double Derivative, Dead Diaeresis) key.

"U+030A"

結合 Ring Above（ Dead Above Ring ）キー The Combining Ring Above (Dead Above Ring) key.

"U+030B"

結合二重鋭アクセント（ Dead Doubleacute ）キー The Combining Double Acute Accent (Dead Doubleacute) key.

"U+030C"

結合キャロン（ Hacek, V Above, Dead Caron ）キー The Combining Caron (Hacek, V Above, Dead Caron) key.

"U+0327"

結合セディーユ（ Dead Cedilla ）キー The Combining Cedilla (Dead Cedilla) key.

"U+0328"

結合 Ogonek（ Nasal Hook, Dead Ogonek ）キー The Combining Ogonek (Nasal Hook, Dead Ogonek) key.

"U+0345"

結合 Greek Ypogegrammeni（ Greek Non-Spacing Iota Below, Iota Subscript, Dead Iota ）キー The Combining Greek Ypogegrammeni (Greek Non-Spacing Iota Below, Iota Subscript, Dead Iota) key.

"U+20AC"

ユーロ通貨記号キー（ € ） The Euro Currency Sign key (€).

"U+3099"

片仮名−平仮名有声音結合符号（ 濁音符号 ）キー The Combining Katakana-Hiragana Voiced Sound Mark (Dead Voiced Sound) key.

"U+309A"

片仮名−平仮名無声音結合符号（ 半濁音符号 ）キー The Combining Katakana-Hiragana Semi-Voiced Sound Mark (Dead Semivoiced Sound) key.

A.6.8 UIEvent

A.6.9 ProgressEvent

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:ev="http://www.w3.org/2001/xml-events"
     version="1.2" baseProfile="tiny" width="300" height="430">

  <script><![CDATA[
    function showImage(imageHref) {
      var image = document.getElementById('myImage');
      image.setTraitNS("http://www.w3.org/1999/xlink", "href", imageHref);
    }

    function imageLoadStart(evt) {
      var progressBar = document.getElementById('progressBar');
      var loadingAnimation = document.getElementById('loadingAnimation');
      progressBar.setFloatTrait("width", 0);
      loadingAnimation.beginElement();
    }

    function imageLoadProgress(evt) {
      if (evt.lengthComputable) {
        var progressBar = document.getElementById('progressBar');
        progressBar.setFloatTrait("width", 100 * (evt.loaded / evt.total));
        progressBar.setTrait("display", "inline");
      }
    }

    function imageLoadComplete(evt) {
      var progressBar = document.getElementById('progressBar');
      var loadingAnimation = document.getElementById('loadingAnimation');
      progressBar.setTrait("display", "none");
      loadingAnimation.endElement();
    }
  ]]></script>

  <image xml:id="myImage" xlink:href="imageA.png" width="300" height="400">
    <handler ev:event="loadstart">
      imageLoadStart(evt);
    </handler>

    <handler ev:event="progress">
      imageLoadProgress(evt);
    </handler>

    <handler ev:event="loadend">
      imageLoadComplete(evt);
    </handler>
  </image>

  <rect rx="4" x="50" y="400" width="200" height="30" cursor="pointer">
    <handler ev:event="click">
      showImage('imageB.png');
    </handler>
  </rect>
  <text x="150" y="420" font-size="15" fill="white" text-anchor="middle"
        text-decoration="underline" pointer-events="none">
    Load other image
  </text>

  <g display="none">
    <rect x="100" y="300" height="10" width="100" fill="black"/>
    <rect xml:id="progressBar" x="100" y="300" width="50" height="10" fill="lime"/>
  </g>
  <text x="150" y="330" font-size="15" text-anchor="middle" display="none">
    Loading...
    <animate xml:id="loadingAnimation" attributeName="display"
             begin="indefinite" dur="2s" repeatDur="indefinite"
             calcMode="discrete" values="inline; none"/>
  </text>
</svg>

A.7 Module: smil

SMIL API からサブセット化された単一のインターフェースを含む。 Contains a single subsetted interface from the SMIL APIs.

A.7.1 ElementTimeControl

A.7.2 TimeEvent

A.8 Module: svg

A.8.1 SVGException

A.8.2 SVGDocument

A.8.3 SVGUseElement

A.8.4 SVGElementInstance

下の例で、３つの use 要素が同じ rect 要素を参照している。 各 use は異なる fill プロパティを持ち、利用される rect へ継承される。 その結果、３つの rect は異なる色の fill になる。 これら３つの rect のどれでも１つをクリックすると４番目の rect の色がクリックされたものと同じになる。 注意すべきは、参照先の rect が defs 要素内で定義されていなかった場合、その rect がクリックされたときにスクリプトが例外を投げることである。 これは currentTarget 属性が correspondingUseElement 属性を持たない SVGElement を返すことになるからである。 In the example below, three 'use' elements use the same 'rect' element. Each 'use' has different 'fill' properties that are inherited down to the used 'rect'. The result is three 'rect' elements with different 'fill' colors. Clicking one of these three 'rect' elements will cause a fourth 'rect' to change color to match the clicked one. Worth noticing is that if the original 'rect' had not been in the 'defs' element the script would throw an exception when the original 'rect' is clicked. This is because the currentTarget attribute would return an SVGElement that doesn't have the correspondingUseElement attribute.

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:ev="http://www.w3.org/2001/xml-events"
     version="1.2" baseProfile="tiny" width="640" height="480" viewBox="0 0 640 480">

  <defs>
    <rect xml:id="r1" width="90" height="65"/>
  </defs>

  <use xlink:href="#r1" x="50" y="200" fill="red"/>
  <use xlink:href="#r1" x="250" y="200" fill="blue"/>
  <use xlink:href="#r1" x="450" y="200" fill="green"/>

  <rect xml:id="r2" x="250" y="50" width="90" height="65"/>

  <ev:listener observer="r1" event="ev:click" handler="#handler"/>

  <handler xml:id="handler" type="application/ecmascript">changeColor(evt);</handler>

  <script type="application/ecmascript">
    var target = document.getElementById("r2");

    function changeColor(evt) {
      var useElement = evt.currentTarget.correspondingUseElement;
      target.setRGBColorTrait("fill", useElement.getRGBColorTrait("fill"));
    }
  </script>
</svg>

A.8.5 SVGSVGElement

 [currentScale      0       currentTranslate.x]         [cos(currentRotate) -sin(currentRotate 0]
 [     0      currentScale  currentTranslate.y]  by     [sin(currentRotate) cos(currentRotate) 0]
 [     0            0               1         ]         [         0                  0         1]
 

A.8.6 SVGRGBColor

A.8.7 SVGRect

A.8.8 SVGPoint

A.8.9 SVGPath

A.8.10 SVGMatrix

    [ x' ]    [  a  c  e  ]   [ x ]    [ a.x + c.y + e ]
    [ y' ] =  [  b  d  f  ]   [ y ] =  [ b.x + d.y + f ]
    [ 1  ]    [  0  0  1  ]   [ 1 ]    [        1      ]
 

A.8.11 SVGLocatable

以下の例で getBBox() メソッドのふるまいをより明らかにする。 例には短い説明と SVG 素片に続いて次の書式で表記される一連の包含ボックス値が含まれる： The following examples further clarify the behavior of the getBBox() method. The examples have a short explanation, an SVG fragment and are followed by a set of bounding box values which have the following format:

[elementId] : {x, y, width, height} | {null} [elementId] : {x, y, width, height} | {null}

ここで x, y, width, height は、指定された ID の要素に対する getBBox 呼び出しから返された SVGRect オブジェクトの値になる。 包含ボックスが null になり得る少数の場合がある（Example 6 を見よ）。 where x, y, width and height define the values of the SVGRect objects returned from a getBBox call on the element with the specified ID. There are a few cases where the bounding box may be null (see example 6).

<g xml:id="group1" transform="translate(10, 20)" fill="red">
    <rect xml:id="rect1" transform="scale(2)" x="10" y="10" width="50" height="50"/>
    <rect xml:id="rect2" x="10" y="10" width="100" height="100"/>
    <g xml:id="group2" transform="translate(10, 20)">
        <rect xml:id="rect3" x="0" y="10" width="150" height="50"/>
        <circle xml:id="circle1" cx="20" cy="20" r="100" />
    </g>
</g>
    

結果：
[group1] : {-70.0, -60.0, 230.0, 200.0}
[rect1] : {10.0, 10.0, 50.0, 50.0}
[rect2] : {10.0, 10.0, 100.0, 100.0}
[group2] : {-80.0, -80.0, 230.0, 200.0}
[rect3] : {0.0, 10.0, 150.0, 50.0}
[circle1] : {-80.0, -80.0, 200.0, 200.0}

<g xml:id="group1" transform="translate(10, 20)" fill="red">
    <rect xml:id="rect2" x="10" y="10" width="400" height="0"/>
    <g xml:id="group2" transform="translate(10, 20)">
        <rect xml:id="rect3" x="0" y="10" width="150" height="50"/>
    </g>
</g>
    

結果：
[group1] : {10.0, 10.0, 400.0, 70.0}
[rect2] : {10.0, 10.0, 400.0, 0.0}
[group2] : {0.0, 10.0, 150.0, 50.0}
[rect3] : {0.0, 10.0, 150.0, 50.0}

<svg xml:id="mySVG" version="1.2" baseProfile="tiny" width="10" height="20">
    <g xml:id="group1" transform="translate(10, 20)" fill="red">
        <rect xml:id="rect1" x="10" y="10" width="100" height="100"/>
        <ellipse xml:id="ellipse1" cx="20" cy="20" rx="0" ry="70" />
    </g>
</svg>
    

結果：
[mySVG] : {20.0, -30.0, 100.0, 160.0}
[group1] : {10.0, -50.0, 100.0, 160.0}
[rect1] : {10.0, 10.0, 100.0, 100.0}
[ellipse1] : {20.0, -50.0, 0.0, 140.0}

<svg xml:id="mySVG" version="1.2" baseProfile="tiny" width="0" height="50">
    <g xml:id="group1" transform="translate(10, 20)" fill="red" >
        <rect xml:id="rect1" x="10" y="10" width="50" height="50"/>
        <g xml:id="group2" transform="translate(10, 20)">
            <rect xml:id="rect2" x="0" y="10" width="150" height="0"/>
            <circle xml:id="circle1" cx="20" cy="20" r="500"/>
        </g>
    </g>
</svg>
    

結果：
[mySVG] : {-460.0, -440.0, 1000.0, 1000.0}
[group1] : {-470.0, -460.0, 1000.0, 1000.0}
[rect1] : {10.0, 10.0, 50.0, 50.0}
[group2] : {-480.0, -480.0, 1000.0, 1000.0}
[rect2] : {0.0, 10.0, 150.0, 0.0}
[circle1] : {-480.0, -480.0, 1000.0, 1000.0}

<svg version="1.2" baseProfile="tiny">
    <defs>
        <rect xml:id="myRect" x="0" y="0" width="60" height="40"/>
    </defs>
    <use xml:id="myUse" xlink:href="#myRect" x="-30" y="-20"/>
</svg>
    

結果：
[myRect] : {0.0, 0.0, 60.0, 40.0}
[myUse] : {-30.0, -20.0, 60.0, 40.0}

<g xml:id="emptyG"/>
    

結果：
[emptyG] : {null}

<g xml:id="g1">
    <g xml:id="g1.1.display.none" display="none">
        <rect xml:id="rect1" x="10" y="10" width="40" height="40"/>
    </g>
    <rect xml:id="rect2.visibility.hidden" visibility="hidden" x="30" y="60" width="10" height="20"/>
</g>
    

結果：
[g1] : {30.0, 60.0, 10.0, 20.0}
[g1.1.display.none] : {10.0, 10.0, 40.0, 40.0}
[rect1] : {10.0, 10.0, 40.0, 40.0}
[rect2.visibility.hidden] : {30.0, 60.0, 10.0, 20.0}

<g xml:id="g1">
    <line xml:id="line1" x2="100" y2="100" transform="rotate(-45)"/>
</g>
    

結果：
[g1] : {0.0, 0.0, 141.42136, 0}
[line1] : {0.0, 0.0, 100.0, 100.0}

<g>
    <line xml:id="thickLine" stroke-width="10" x2="100" y2="0"/>
</g>
    

結果：
[thickLine] : {0.0, 0.0, 100.0, 0.0}

<svg xml:id="rootSvg" version="1.2" baseProfile="tiny" width="500" height="300" viewBox="0 0 200 100">
    <rect x="-100" y="-200" width="500" height="100"/>
</svg>
    

結果：
[rootSVG] : {-100, -200, 500, 100}

        <g xml:id="g1">
          <linearGradient xml:id="MyGradient"/>
            <stop offset="0.05" stop-color="#F60"/>
            <stop offset="0.95" stop-color="#FF6"/>
          </linearGradient>
        </g>
      

結果：
[g1] : {null}

A.8.12 SVGLocatableElement

A.8.13 TraitAccess

この仕様、 SVG Tiny 1.2 uDOM でサポートされる trait

trait アクセスはすべての SVG Tiny 1.2 の属性とプロパティ には要求されていない。 下の一覧表に SVG Tiny 1.2 uDOM 実装が trait アクセスをサポートしなければならない属性とプロパティを掲げる。 各行に属性に可能なゲッタとセッタを挙げる。 「省略値」の列にそれぞれの属性またはプロパティに利用しなければならない 省略値 が指定される。 「省略値」の列が空のものには 省略値 が存在しない。 特に「コメント」の列に明記されていない限り、サポートされる属性はそれが属せるすべての要素においてアクセス可能になる。 属性の一覧および、属性がどの要素に属せるかについては 属性一覧 を見よ。 Trait access is not required on all of the SVG Tiny 1.2 attributes and properties. The table below shows the attributes and properties that SVG Tiny 1.2 uDOM implementations must support trait access to. Each attribute row lists the allowed getters and setters. The "Lacuna Value" column specifies the lacuna value that must be used for each attribute or property. If a "Lacuna Value" column entry is empty, there is no lacuna value. Unless explicitly stated in the "Comments" column, a supported attribute is accessible on all elements it can belong to. See the attribute table for a list of attributes and which elements they belong to.

複数のバージョンの SVG をサポートする実装は、最も広範なセットの trait アクセスをサポートしなければならない。 各 trait でサポートされる型についても最も広範なセットをサポートしなければならない。 しかしながら、将来版で利用できる trait や trait の型に依存する内容がすべての適合 SVG Tiny 1.2 uDOM 実装で動作するとは限らない。 Implementations that support multiple versions of SVG must allow trait access to the most extensive set and support the types supported by each trait in the most extensive set. However, content relying on traits or trait types available in future versions may not work in all conformant SVG Tiny 1.2 uDOM implementations.

UA はサポートしない trait に対する trait メソッドの利用が試みられた際には、 NOT_SUPPORTED_ERR をレイズしなければならない。 The user agent must raise a NOT_SUPPORTED_ERR whenever there is an attempt to use trait methods for traits which are not supported by the user agent.

一部の属性とデータ型には 追加規則 が適用される。 これらの規則は一覧表の下で定義される。 For some of the attributes and data types additional rules apply. These rules are defined below the table.

注記： 下の表で： Note: In the table below:

• UA が getTrait メソッドをサポートしなければならない旨が示されている所では常に getTraitNS, getPresentationTrait, getPresentationTraitNS メソッドもサポートしなければならない。 Wherever the table indicates that a user agent must support the getTrait method, it must also support the getTraitNS, getPresentationTrait , and getPresentationTraitNS methods.
• UA が getTraitNS メソッドをサポートしなければならない旨が示されている所では常に getPresentationTraitNS メソッドもサポートしなければならない。 Wherever the table indicates that a user agent must support the getTraitNS method, it must also support the getPresentationTraitNS method.
• UA が型のある（すなわち非文字列の） trait ゲッタメソッドの一つ（ getFloatTrait など）をサポートしなければならない旨が示されている所では常に、対応する trait presentation ゲッタメソッド（ getFloatPresentationTrait など）もサポートしなければならない。 Wherever the table indicates that a user agent must support one of the typed (i.e., non-string) trait getter methods (e.g., getFloatTrait), it must also support the corresponding trait presentation getter method (e.g., getFloatPresentationTrait).
• UA が setTrait メソッドをサポートしなければならない旨が示されている所では常に setTraitNS メソッドもサポートしなければならない。 Wherever the table indicates that a user agent must support the setTrait method, it must also support the setTraitNS method.
• trait が利用できるのは属性とプロパティ値へのアクセスのみであり、フォント記述子へのアクセスには利用できない。 Traits can only be used for accessing attribute and property values. They cannot be used for accessing font descriptors.

A.8.14 追加のアクセス規則

transform 属性へのアクセス規則

SVG Tiny 1.2 の transform 属性が取り得る値の型は３種類になる：「通常の」変換リスト（拡縮, 並進, 回転, 行列, 等々）, 新たに導入された 'ref(svg)' 型, 'none' 。 いずれの場合においても getMatrixTrait は現在の行列の評価を返す。 利用者が transform 属性の値が 'ref' または 'none' だったかどうか知る必要がある場合、 getTrait を用いなければならない。 利用者は setTrait 用いて transform 属性を 'ref(svg)' や 'none' に設定できる。 The 'transform' attribute in SVG Tiny 1.2 can have three types of values. The "normal" transformation list (e.g. scale, translate, rotate, matrix, etc.), the newly introduced 'ref(svg)' type or 'none'. getMatrixTrait returns the current evaluated matrix in all cases. If the user needs to know that the 'transform' attribute value was a 'ref' or a 'none', getTrait must be used. By using setTrait the user can set the 'transform' attribute to 'ref(svg)' or 'none'.

display プロパティへのアクセス規則

下位互換性の理由から trait の仕組みによる display 値へのアクセスは 'none' と 'inline' に限定される。 他のすべての値は 'none' または 'inline' に変換される。 display 値に可能なすべての値の一覧は 可視性の制御 を見よ。 ） 他の display 値を扱うためには、例えば利用者が display を 'block' に設定することを望む場合、より汎用の getAttributeNS / setAttributeNS を用いなければならない。 しかしながら、 SVG Tiny 1.2 UA には display の正規化 に述べたように、その属性データの正規化が許容されていることに注意。 Due to backward compatibility reasons the 'display' values accessible via the trait mechanism are limited to 'none' and 'inline', all other values are translated into 'none' or 'inline'. (For a list of all possible 'display' values, see Controlling visibility.) If other 'display' values are of interest, e.g. the user want to set display to 'block', the more generic getAttributeNS/setAttributeNS must be used. Note however that an SVG Tiny 1.2 user agent is allowed to normalize its attribute data as described in Display normalization.

アニメーション関連の要素へのアクセス規則

以下の規則が SMIL アニメーション要素（ animate, animateTransform, animateColor, animateMotion, set, discard ）に適用される。 The following rule applies to SMIL animation elements ('animate', 'animateTransform', 'animateColor', 'animateMotion', 'set' , 'discard').

これらの要素は木への挿入や木からの除去はできるが、一旦木に挿入された後は TraitAccess メソッドでは変更できない。 そのような試みが行われた場合、 TraitAccess メソッドは NOT_SUPPORTED_ERR の DOMException を投げる。 Element インターフェースの setAttribute や setAttributeNS メソッドにより要素を変更した場合、文書は変化するが、アニメーションには効果を及ぼさない。 These elements can be inserted and removed from the tree but they cannot be modified using the TraitAccess methods once inserted into the tree. If an attempt is made to do so, the TraitAccess method will throw a DOMException with code NOT_SUPPORTED_ERR. Modifying the element using the setAttribute and setAttributeNS methods of the Element interface will change the document, but will have no effect on the animation.

この制約は文書作成者がスクリプトを通したアニメーションの追加を望む場合、アニメーション要素の属性は木へ挿入される前に変更されなければならないことを意味する。 下に関連の属性を挿入前に設定して文書へアニメーションを追加する例を示す。 This restriction means that if the author wishes to add animations via script, the attributes of the animation elements must be modified before being inserted into the tree. The following is an example of adding an animation to the document, setting the relevant attributes prior to insertion.

<svg version="1.2" baseProfile="tiny" xmlns="http://www.w3.org/2000/svg" xml:id="svg-root"
      width="100%" height="100%" viewBox="0 0 480 360">
    <rect xml:id="myRect" fill="green" x="10" y="10" width="200" height="100" stroke="black" stroke-width="2"/>
</svg>

SVGElement newAnimate = (SVGElement)document.createElementNS(svgNS, "animate");
newAnimate.setTrait("attributeName", "fill");
newAnimate.setTrait("from", "red");
newAnimate.setTrait("to", "blue");
newAnimate.setTrait("dur", "5");
newAnimate.setTrait("repeatCount", "10");
Element myRect = document.getElementById("myRect");
myRect.appendChild(newAnimate);
    

x, y 属性へのアクセス規則

getFloatTrait が text 要素の x や y 属性の取得に用いられる際に、属性値に複数の <coordinate> が含まれている場合、エラーコード TYPE_MISMATCH_ERR の DOMException がレイズされなければならない。 属性値が１つだけの座標成分を持つ場合、これは getFloatTrait から返される値になる。 If getFloatTrait is used to retrieve the value of the 'x' or 'y' attribute on a 'text' element, where the attribute value has more than one <coordinate>, a DOMException with error code TYPE_MISMATCH_ERR must be raised. When the attribute value has only one coordinate, this is the value returned by getFloatTrait.

getFloatListTrait または setFloatListTrait が text 要素以外の要素に用いられる場合、エラーコード TYPE_MISMATCH_ERR の DOMException がレイズされなければならない。 If getFloatListTrait or setFloatListTrait are used on elements other than a 'text' element, a DOMException with error code TYPE_MISMATCH_ERR must be raised.

width, height 属性へのアクセス規則

getFloatTrait が svg 要素の width や height 属性の取得に用いられる際に、属性値が百分率もしくは単位付きで指定されていた場合、エラーコード TYPE_MISMATCH_ERR の DOMException がレイズされなければならない。 If getFloatTrait is used to retrieve the value of the 'width' or 'height' attribute on an 'svg' element, where the value is specified as a percentage or unit value, a DOMException with error code TYPE_MISMATCH_ERR must be raised.

フォントプロパティへのアクセス規則

font-face 要素の font-family, font-style, font-weight プロパティの取得や設定に trait アクセサが用いられた場合、エラーコード NOT_SUPPORTED_ERR の DOMException がレイズされなければならない。 If trait accessors are used to get or set the 'font-family', 'font-style' or 'font-weight' properties on a 'font-face' element, a DOMException with error code NOT_SUPPORTED_ERR must be raised.

パス属性へのアクセス規則

getPathTrait メソッドが SVGPath の取得に利用される際に、パス属性内のどこかに構文上の誤りがあった場合、返り値は誤りが生じた手前までの有効なパス区分すべてを含む SVGPath でなければならない。 If the getPathTrait method is used to get an SVGPath and the path attribute was syntactically invalid at some point, the return value must be an SVGPath containing all valid path segments until the point of the error.

マルチメディア要素へのアクセス規則

以下の規則がマルチメディア要素（ audio, video, animation ）に適用される。 The following rule applies to multimedia elements ('audio', 'video', 'animation').

一旦木へ挿入後は TraitAccess メソッドを利用した SVG タイミング属性 の変更はできない。 そのような試みが行われた場合、 TraitAccess メソッドはコード NOT_SUPPORTED_ERR の DOMException を投げることになる。 Element インターフェースの setAttribute や setAttributeNS メソッドによりこれらの属性を変更した場合、文書は変化するが、要素には効果を及ぼさない。 SVG timing attributes cannot be modified using the TraitAccess methods once inserted into the tree. If an attempt is made to do so, the TraitAccess method will throw a DOMException with code NOT_SUPPORTED_ERR. Modifying these attributes using the setAttribute and setAttributeNS methods of the Element interface will change the document, but will have no effect on the element.

A.8.15 SVGElement

A.8.16 SVGTimedElement