インターネット上では、リソースはURL (国際化リソース識別子)を使って識別されます。例えば、http://example.com にある someDrawing.svg というSVGファイルは以下のURLを持ちます:
http://example.com/someDrawing.svg
URLは、URLフラグメント識別子を組み合わせることで、XML文書内の特定要素を指定することもできます。URLにフラグメント識別子が含まれる場合は、オプションのベースURLの後に「#」文字、その後にURLフラグメント識別子が続きます。例えば、次のURLで someDrawing.svg 内のIDが "Lamppost" の要素を指定できます:
http://example.com/someDrawing.svg#Lamppost
以下のいずれかは無効な参照です:
無効な参照がエラーになるかどうかは (エラー処理参照)、 参照しているプロパティや属性がフォールバック動作を定義しているかどうかによります。
国際化リソース識別子(URL)は、Uniform Resource Identifiers(URI)をより一般化したものです。URLは ユニバーサルキャラクタセット [UNICODE] の文字列で構成されます。 URIはより限定された文字セットで構成されます。URIはすべて既に適合したURLです。URLからURIへのマッピングは URL仕様で定義されており、URLはXML文書内でURIの代わりにリソース識別に利用できます。URLは、プロトコルが直接対応していない場合はネットワーク解決のためURIに変換できます。
従来のSVG仕様では、XLinkに従い、URL参照型は「URIまたは特定のエスケープ手順後にURLになる文字列」として定義されていました。このエスケープ手順はXLink 1.0仕様 [xlink] と W3C XML Schema Part 2: Datatypes仕様 [xmlschema-2] にも繰り返し記載されていました。 この重複は誤りや分岐の可能性を生みましたが、URL仕様がまだ標準化されていなかったため行われていました。
本仕様では、この「URIまたは文字列+アルゴリズム」には正しい用語URLを用い、URLをURIに変換するエスケープ方法は URL仕様 [rfc3987]に従って定義します(これはIETF現行標準になりました)。他のW3C仕様も、今後この重複したエスケープ記述を廃止し、 URLを直接参照するように改訂される予定です。
SVGでは、2つの要素間の構造的関係のほとんどは、‘href’属性にURL値を指定することで記述されます。 しかし、多くのプレゼンテーション属性は、内容としてURLとテキスト文字列の両方を許可します。 テキスト文字列を相対URLと区別するために、<url> 生成式がプレゼンテーション属性および対応するCSSプロパティ [css-values] で使用されます。 これは単に、機能記法で区切られたURLです。
SVGは、絶対・相対の両方のURL参照を他のオブジェクトに対して広く利用します。 例えば、‘linearGradient’要素は、別のグラデーション要素を元にして、 差分だけを定義することができます。その際、‘href’属性にURLで元のグラデーションを参照します:
<linearGradient id="SourceGradient">...</linearGradient> <linearGradient id="MyGradient" href="#SourceGradient">...</linearGradient>
このグラデーションで長方形を塗りつぶすには、長方形のfillプロパティ値に、 該当する‘linearGradient’要素へのURL参照を含めます。例:
<rect fill="url(#MyGradient)"/>
URL参照は通常、 ‘href’属性で指定します。 この属性値が目的のリソース(フラグメント識別子がある場合は副次リソース)への参照となります。 ‘href’属性の値はURLでなければなりません。
任意のアプリケーションが値のURL参照性を検証するのは現実的でないため、本仕様はURL仕様に従い、SVGオーサリングツールに対してそのような適合性検査要件は課しません。 無効なURLがあってもSVG文書は非適合にはなりません。 SVGユーザーエージェントは、必要な場合のみURLを処理すればよく、 URL参照の処理に記載の通りです。
従来のSVGでは、‘href’ 属性はXLink名前空間 [xlink] で指定されていました。 この用法は現在非推奨となり、URL参照は 名前空間なしの‘href’属性で指定すべきです。
後方互換性のため、非推奨の‘xlink:href’属性、 ならびに同じく非推奨の‘xlink:title’属性が定義されています。
属性定義:
名前 | 値 | 初期値 | アニメーション可能 |
---|---|---|---|
xlink:href | URL [URL] | (なし) | (下記参照) |
後方互換性のため、‘href’属性を持つ要素は、XLink名前空間 [xlink] の‘href’属性も認識します。
名前空間なしの‘href’属性とXLink名前空間の‘href’属性が 両方存在する場合は、名前空間なしの属性値を使用し、XLink名前空間の属性は無視します。
適合SVG生成器は、名前空間なしの‘href’属性を生成しなければなりません。 ただし、後方互換性のためにXLink名前空間付きの‘href’属性も生成することは可能です。
この属性は、対応する‘href’属性が アニメーション可能と定義されている場合のみアニメーション可能です。
名前 | 値 | 初期値 | アニメーション可能 |
---|---|---|---|
xlink:title | <anything> | (なし) | 不可 |
リンクやリソースの意味を人間が読める形で記述するための非推奨属性です。 新しいコンテンツでは‘xlink:title’属性ではなく、‘title’子要素を使ってください。
この情報の利用は処理形態に大きく依存します。例えば、視覚障害者向けアプリケーションでタイトルを利用したり、リンクの一覧表を作成したり、マウスポインターをリソース上に置いたときヘルプテキストを表示するなどの用途があります。
‘title’属性を使う場合はXLink名前空間でなければなりません。 詳細はXMLリンク言語(XLink) [xlink] を参照。
非推奨XLink属性‘xlink:href’や ‘xlink:title’を使う場合は、 明示的なXLink名前空間宣言が必要です [xml-names]。 XLink名前空間宣言を与える最も簡単な方法は、XLink属性を使うコンテンツの‘svg’要素に ‘xmlns’属性でXLink名前空間を宣言することです。例:
<svg xmlns:xlink="http://www.w3.org/1999/xlink" ...> <image xlink:href="foo.png" .../> </svg>
URLは必要となった時点でリソース特定のために以下のように処理されます:
レガシー‘xlink:href’属性は、対応する‘href’属性が存在しない場合のみ、同じタイミングで処理されます。
URLの処理は三つのステップで行われます: 絶対URLの生成、 文書の取得(必要な場合)、 ターゲット要素の特定(必要な場合)。
URL参照は、処理によって無効な参照になるか、ターゲットリソースが特定されるまで未解決状態です。 構造的外部要素の非プレゼンテーション属性に未解決参照があると、loadイベントの発火を妨げます。ユーザーエージェントは、同一文書URL参照でない参照の解決に時間制限を設けてもよく、制限後はネットワークエラーとして扱い(結果として無効な参照扱い)、処理を終了します。
動的文書内の同一文書URL参照については、属性やプロパティの変更・アニメーション、DOMからの要素削除などによってURL参照が未解決状態に戻ることがあります。 ユーザーエージェントは再度URI解決を試み、参照リソースの特定を行わなければなりません。
URL参照が相対URLの場合は、使用前に絶対化しなければなりません。 絶対URLは次のいずれかの方法で生成します:
‘xml:base’属性はXML文書でのみ効果があります(SVG文書やXHTML文書には有効ですが、XMLでないHTML文書には無効)。
一方、base
要素はSVG・HTML文書のいずれでも相対URLに影響し、文書ベースURLを変更します。
HTTPなどのプロトコルがURLを直接サポートしない場合は、ユーザーエージェントがURLをURIに変換する必要があり、これはURL仕様 [rfc3987] 3.1節の通りです。
絶対URL生成後:
リンクのアクティベートに伴いURLが処理される場合は、ユーザーエージェントは現行標準HTML仕様で記載されたURLへのナビゲートのアルゴリズムに従います [HTML]。 このアルゴリズムの結果は、‘target’ブラウジングコンテキストやコンテキスト間のセキュリティ制約、現在の文書とリンク先が同じかどうか(同じ場合はフラグメント移動のみで文書再読み込みなし)によって異なります。 移動先がSVG文書の場合は、SVGコンテンツへのリンクに記載のターゲット動作に従ってください。
URLが完全な文書ファイルを参照している場合のみ有効となる場合 (‘image’要素や‘script’要素の‘href’属性など)、 文書の取得に記載の通り処理を続行します(URLが同一文書でも)。
その他の場合は、URLはこのSVG文書内で利用されるリソース用です。 ユーザーエージェントはURLを解析し、ターゲットフラグメントとURLの他の部分を分離し、文書ベースURLと比較します。 ターゲットフラグメント以外がすべて一致する場合は同一文書URL参照であり、ターゲット要素の特定に記載の通り現在の文書を参照先として処理を続行します。
それ以外の場合はURLが別の文書を参照するため、文書の取得に記載の通りURL処理を続行します。
CSS値と単位で定義されているように、スタイルプロパティにおけるフラグメントのみのURLは、宣言されたファイル種別に関わらず同一文書URL参照として扱われなければなりません。
SVGプロパティや属性は他の文書を参照できます。 このようなURLを処理する際、ユーザーエージェントは本節で述べる方法で参照文書を取得すべきですが、以下の条件では例外となります:
href属性がSVGアニメーション要素上の場合は、 同一文書URL参照のみ許可されます [svg-animation]。 異なる文書を参照するURLは無効となり、文書は取得されません。
参照元の文書がセキュア静的モードまたはセキュアアニメーションモードで処理されている場合は、 外部ファイル参照は許可されません。 参照がdata URLでない限り、ユーザーエージェントはネットワークエラーとして扱い、無効な参照扱いとします。
ブラウジングコンテキストまたはユーザーエージェントの他のセキュリティ制限で外部ファイルアクセスが妨げられる場合も、ユーザーエージェントはネットワークエラーとして扱う必要があります。
インターネットから外部リソースを取得する際、ユーザーエージェントはHTMLで定義されたCORS有効化リクエストを使わなければならず [HTML]、corsAttributeStateは以下の通りです:
base
リクエストのoriginはHTMLと同じルールで計算されます
(現行標準HTML)。
SVGの‘script’要素はHTMLのscript
要素と同様に扱い、
SVGの‘image’要素はHTMLのimg
要素と同様に扱います。
default origin behaviourはtaintに設定しなければなりません。
将来のSVG仕様では、他のSVG要素の‘href’属性にもCORS参照が可能となる場合があります。
取得アルゴリズムがエラーまたは空のレスポンスボディとなった場合、参照URLは無効な参照として扱います。
正常なレスポンスが返され、参照の有効なURLターゲットに特定の要素型が含まれる場合、ユーザーエージェントはサブリソース文書の処理に進みます。 (URL参照が文書全体のみ有効な場合は、取得した文書が参照リソースとなります。)
それ以外の場合、サブリソースはターゲット要素を特定するためにパースされなければなりません。 取得された文書がユーザーエージェントによってパースされ、ドキュメントオブジェクトモデルを生成できる型であれば、 セキュア静的モードで処理します (追加の外部リソースを取得せず、スクリプトの実行やアニメーション・動画の再生もしない)。 外部サブリソース参照用に生成された文書モデルは不変(読み取り専用)で、変更できません。
取得ファイルからドキュメントオブジェクトモデルが生成できる場合、 URLの処理はターゲット要素の特定で示した通り、 パース済みサブリソース文書を参照文書として続行します。 ユーザーエージェントは文書の完全パース前にターゲット特定処理を開始してもかまいません。
ユーザーエージェントは外部リソースURLとそれに対応するパース済み文書のリストを保持し、 処理モード・キャッシュ・CORS要件に反しない限り、後続の参照時に文書を再利用しても構いません。
特定要素へのURL参照の場合、 その参照が有効かどうかは、参照先文書内で要素を見つけられるか、かつ許可された型であるかによって決まります。
先の処理ステップで特定された参照文書(外部サブリソース文書または現在の文書)を使って、 ターゲット要素は次の方法で特定されます:
URLがターゲットフラグメントで特定要素を指定していない場合、 ターゲット要素は参照文書のルート要素です。
それ以外の場合、URLは特定要素をターゲットにします。 参照文書内に一致する要素が現在存在する場合、それがターゲット要素です。
それ以外の場合、一致する要素が現在ありません。 参照文書が不変の場合、URL参照は無効です。 外部サブリソース文書は完全にパースされた時点で常に不変です。 現在の文書も、動的インタラクティブモード以外でパースされた場合は不変です。
それ以外の場合は、参照文書への変更を監視し、 URLが正常に解決されてターゲット要素が特定できるまで、 あるいは文書が不変になるまで(例:非動的文書がパースを完了した場合)、 継続して観察します。
ターゲット要素が参照に対して有効なURLターゲットである場合のみ、参照リソースを提供します。
‘href’(または‘xlink:href’)属性の有効なターゲット要素型は、 属性を持つ要素によって以下のように決まります:
本仕様で定義されるスタイルプロパティの有効なターゲット要素型は以下の通りです:
ターゲット要素または画像ファイルの参照を許可する場合(shape-inside、shape-subtract、maskプロパティなど)、 ユーザーエージェントはターゲット要素を特定し、それが有効なターゲットか判定しなければなりません。 解決されたターゲット要素が許可された型でない場合、参照リソースは文書ファイル全体となり、 ターゲットフラグメントは他の画像同様、そのファイルの処理時に利用されます。
それ以外の場合、解決されたターゲット要素型(または文書型)がURL参照に許可されていなければ、無効な参照です。
SVGはリンク(ハイパーリンクまたはWebリンクとも呼ばれる)を示す‘a’要素を提供します。 ‘a’要素は、‘href’ または‘xlink:href’属性を持つ場合にリンクとなります。これらの属性がない場合、‘a’要素はリンクの非アクティブなプレースホルダーです。
SVG 1.1ではXLink仕様([XLink])によって定義され、XLink名前空間の属性を使用していました。 SVG 2ではHTMLリンクと整合するデフォルト名前空間の属性セットを使い、XLink属性を非推奨としています。
‘a’要素は、親要素が含められる全ての要素を含むことができますが、他の‘a’要素は除きます。 グラフィカル・テキスト両方のリンク付きコンテンツで同じ要素を使います。 リンクは入れ子にできません。 ‘a’要素が他のハイパーリンク要素(SVG名前空間でも他の名前空間でも)の子孫の場合、ユーザーエージェントはそのhref属性を無視し、非アクティブとして扱う必要があります。 無効な‘a’要素も通常のコンテナ要素として描画されます。
無効な入れ子リンクの描画は未定であり、‘unknown’要素の描画に関する決定と同期される可能性があります。
ポインターイベントの処理では、 ‘a’要素内に含まれる各描画要素ごとにリンクの当たり判定領域が定義されます (各要素のpointer-eventsプロパティ値による)、 ‘a’要素自身のバウンディングボックスではありません。 ユーザーエージェントはすべてのリンクがフォーカス可能であり、キーボード操作でアクティブ化できるようにもする必要があります。
リンク先のリモートリソース(リンクの目的地)は、 ‘a’要素の‘href’属性で指定されたURLによって定義されます。 リモートリソースはあらゆるWebリソース(画像、動画クリップ、音声、プログラム、他のSVG文書、HTML文書、現在の文書内の要素、別文書内の要素など)になり得ます。 ユーザーによるリンクのアクティブ化(マウスクリック、キーボード入力、音声コマンド等)に応じて、ユーザーエージェントは指定されたリソース文書の取得を試み、表示またはダウンロード用ファイルとして利用可能にします。
例 link01は楕円にリンクを割り当てています。
<?xml version="1.0" standalone="no"?> <svg width="5cm" height="3cm" viewBox="0 0 5 3" version="1.1" xmlns="http://www.w3.org/2000/svg"> <desc>Example link01 - a link on an ellipse </desc> <rect x=".01" y=".01" width="4.98" height="2.98" fill="none" stroke="blue" stroke-width=".03"/> <a href="http://www.w3.org"> <ellipse cx="2.5" cy="1.5" rx="2" ry="1" fill="red" /> </a> </svg>
例 link01
上記SVGファイルをSVG・HTML両対応のユーザーエージェントで表示した場合、楕円をクリックすると現在のウィンドウまたはフレームがW3Cホームページに置き換わります。
属性定義:
名前 | 値 | 初期値 | アニメーション可能 |
---|---|---|---|
href | URL [URL] | (なし) | はい |
名前 | 値 | 初期値 | アニメーション可能 |
---|---|---|---|
target | _self | _parent | _top | _blank | <XML-Name> | _self | はい |
親文書がHTMLやXHTML文書に埋め込まれている場合やタブブラウザで表示されている場合など、終了リソースのターゲットが複数候補ある場合に使用します。この属性はリンクアクティブ時にドキュメントを開くブラウジングコンテキスト(ブラウザタブ、SVG/HTML/XHTML iframeやobject要素等)の名前を指定します:
ブラウジングコンテキストとコンテキスト間のナビゲーションアクションに関するセキュリティ制約の規範定義はHTML [HTML](Webページの読み込み章)です。
従来のSVGは特殊なターゲット値'_replace'を定義していました。これは十分に実装されず、'_replace'と'_self'の違いはHTMLのブラウジングコンテキスト定義の変更で不要となりました。現在のSVG文書を置き換えるには'_self'を使ってください。
値'_new'はターゲットとして不正です。新しいタブ/ウィンドウでドキュメントを開くには'_blank'を使ってください。
名前 | 値 | 初期値 | アニメーション可能 |
---|---|---|---|
download | 任意値(空でなければ値は推奨ファイル名を表す) | (なし) | 不可 |
ping | スペース区切りの有効な非空URLトークン[HTML] | (なし) | 不可 |
rel | スペース区切りのキーワードトークン[HTML] | (なし) | 不可 |
hreflang | BCP 47言語タグ文字列[HTML] | (なし) | 不可 |
type | MIMEタイプ文字列[HTML] | (なし) | 不可 |
referrerPolicy | リファラーポリシー文字列[REFERRERPOLICY] | (なし) | 不可 |
a
要素の定義と同じです。
SVGコンテンツはしばしば何かの画像や図を表すため、特定の ビューへのリンクが必要になることがよくあります。ビューは、ドキュメントの特定のセクションをクローズアップ表示するために、初期変換を指示します。
SVG 2 要件: | SVG 1.1 SEテキストとSVG Tiny 1.2テキストのフラグメント識別子リンクトラバーサルを統合し、メディアフラグメントを追加する。 |
---|---|
決議: | SVG 2 はメディアフラグメント識別子を持つ。 |
目的: | Media Fragments URIと整合させるため。 |
担当者: | Cyril (ACTION-3442) |
SVGドキュメントの特定のビューへリンクするためには、フラグメント識別子付きURL参照が正しく構成されたSVGフラグメント識別子である必要があります。SVGフラグメント識別子は、MIMEメディアタイプ "image/svg+xml" のリソースを特定するURLの「セレクタ」や「フラグメント識別子」部分の意味を定義します。
SVGフラグメント識別子は以下の形式で記述できます:
SVGフラグメント識別子は以下のように定義されます:
SVGFragmentIdentifier ::= BareName *( "&" timesegment ) | SVGViewSpec *( "&" timesegment ) | spacesegment *( "&" timesegment ) | timesegment *( "&" spacesegment ) BareName ::= XML_Name SVGViewSpec ::= 'svgView(' SVGViewAttributes ')' SVGViewAttributes ::= SVGViewAttribute | SVGViewAttribute ';' SVGViewAttributes SVGViewAttribute ::= viewBoxSpec | preserveAspectRatioSpec | transformSpec | zoomAndPanSpec viewBoxSpec ::= 'viewBox(' ViewBoxParams ')' preserveAspectRatioSpec = 'preserveAspectRatio(' AspectParams ')' transformSpec ::= 'transform(' TransformParams ')' zoomAndPanSpec ::= 'zoomAndPan(' ZoomAndPanParams ')'
ここで:
SVGビュー・ボックスのパラメータは、CSS変換仕様に従って順番に適用されます(例:SVGビューはまずViewBoxParamsで変換され、次にTransformParamsで変換されます)。
フラグメント仕様内ではスペースが許可されています。SVGビュー仕様内の数値はカンマで区切り(例:#svgView(viewBox(0,0,200,200)))、属性はセミコロンで区切ります(例:#svgView(viewBox(0,0,200,200);preserveAspectRatio(none)))。
フラグメント識別子は、CSS Object Model (CSSOM)仕様で定義されたルールに従い、urlエスケープできます。 例えば、セミコロンは %3B としてエスケープでき、(セミコロン区切りの)URLリストをアニメーションする際に、セミコロンがリストの区切りと解釈されるのを避けられます。
SVGViewAttributeの4つの型は任意の順序で現れますが、正しく構成されたSVGViewSpecでは各型は最大1回のみ出現できます。
ソースドキュメントがSVGドキュメントへのリンクを実行する場合、例えばHTMLアンカー要素 ([HTML]、すなわち <a href=...>要素)や XLink仕様 [xlink]などを介して、 SVGフラグメント識別子はSVGドキュメントの初期ビューを以下のように指定します:
‘view’要素は以下のように定義されています:
viewTarget属性を削除することが決定されました。
決定:2015年パリ F2F 3日目。
担当者:BogdanBrinza。
SVGElement オブジェクトは、DOM内の ‘a’ 要素を表します。
[Exposed=Window] interface SVGAElement : SVGGraphicsElement { [SameObject] readonly attribute SVGAnimatedString target; attribute DOMString download; attribute USVString ping; attribute DOMString rel; [SameObject, PutsForward=value] readonly attribute DOMTokenList relList; attribute DOMString hreflang; attribute DOMString type; attribute DOMString text; attribute DOMString referrerPolicy; }; SVGAElement includes SVGURIReference; SVGAElement includes HTMLHyperlinkElementUtils;
target、 download、 ping、 rel、 hreflang、 type のIDL属性は、 同じ名前のコンテンツ属性を 反映 します。
relList IDL属性は 反映 された ‘rel’ コンテンツ属性を表します。
referrerPolicy IDL属性は 反映 された ‘referrerpolicy’ コンテンツ属性を表し、 既知の値のみ制限されます。
text IDL属性は、 取得時は要素の textContent IDL属性と同じ値を返し、設定時は要素の textContent IDL属性が新しい値に設定されたかのように動作します。
SVGViewElement オブジェクトは、 DOM内の ‘view’ 要素を表します。
[Exposed=Window] interface SVGViewElement : SVGElement {}; SVGViewElement includes SVGFitToViewBox; SVGViewElement includes SVGZoomAndPan;