SVG 関連ドキュメントの索引

56 ページあります:

#	ページ	タグと要約
1	SVG	References, SVG
		No summary!
2	Content type
		No summary!
3	Other Resources	SVG
		No summary!
4	SVG animation with SMIL
		Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) より、Synchronized Multimedia Integration Language (SMIL) を用いた SVG のアニメーションをサポートしています。SMIL では以下のようなことができます:
5	SVG as an Image	Images, SVG
		SVG画像は様々なコンテキストのイメージフォーマットとして使用することができます。多くのブラウザはSVG画像を以下のコンテキストでサポートします。
6	SVG 属性リファレンス	NeedsHelp, NeedsTranslation, SVG, SVG Attribute, SVG Reference, TopicStub
		onbegin, onend, onload, onrepeat
7	cx
		<circle>要素と<ellipse>要素では、この属性は要素の中心のx座標を定義します。もしこの要素が特定できなければ、 ”0"を指定した振る舞いをします。
8	d
		この属性は以下のようにパスを定義します。
9	filterUnits
		filterUnits属性は、 x, y, width そして height の座標系を定義します。
10	transform
		transform属性は、要素と要素の子に適用され変換定義のリストを定義します。transformリストは半角スペースもしくはコンマ（,）で区切り、そのリストは左から右へと順番に適用されます。
11	x
		この属性はユーザー座標のx軸座標を指定します。この属性の正確な影響は各要素の座標に依存します。ほとんどの場合、この属性参照している要素の左上を原点とした長方形のx軸座標を示します（例外については個々の要素のドキュメントを参照してください）。
12	y
		この属性はユーザー座標系のy軸座標を指定します。この属性の正確な影響は各要素の座標に依存します。ほとんどの場合、この属性参照している要素の左上を原点とした長方形のx軸座標を示します（例外については個々の要素のドキュメントを参照してください）。
13	SVG 要素リファレンス	SVG, SVG Reference
		<animate>、 <animateColor>、 <animateMotion>、 <animateTransform>、 <set>
14	<path>	SVG, SVG Element
		path 要素は図形を定義する汎用的な要素です。全ての基本図形は path 要素によって定義されます。
15	a
		SVGのアンカー要素()は、ハイパーリンクを定義します。
16	animate	Element, SVG, Élément
		animate 要素は図形要素の中に入れ、animate要素の属性には、アニメーションによってどのように変化するかを定義します。属性で指定された時間の間、初期値から終了値まで変化します。
17	animateColor
		animateColor要素は時間経過による色の変換を指定します。
18	animateMotion
		animateMotion 要素は、元となる要素を参照しモーションパスに沿って移動します。
19	animateTransform
		animateTransform 要素は、 ターゲット要素に対して変換属性をアニメーション化し、これにより変形、スケーリング、回転およびまたは、スキューするアニメーションを制御することができます。
20	circle
		circle要素はSVGの基本的な図形で、基準となる中心座標と半径を指定して円を生成します。
21	defs
		SVGでは、後で再利用できるよう描画オブジェクトを定義します。参照される要素は、可能なかぎりdefs要素内で定義されることが推奨されています。defs要素内でこれらの要素を定義することは、SVGの要素の可読性を向上させ、ひいては操作性をも向上させます。defs要素の描画要素は、そのままでは描画されません。ビューポート上で描画したい場所へそれらの要素を描画するために、<use>要素を使用します。
22	desc
		SVGで描画された各コンテナ要素またはグラフィック要素は、 desc 要素によって説明文を供給することができ、記述はテキストのみとなります。SVGドキュメントが視覚的なメディアにSVGとしてレンダリングされたとき、desc 要素はグラフィックとしてレンダリングされません。 Alternate presentations are possible, both visual and aural, which display the desc element but do not display path elements or other graphics elements. desc 要素は一般的にはSVGドキュメントの可読性を向上させます。
23	ellipse
		ellipse要素はSVGの基本的な図形であり、中心となる座標とx方向とy方向の半径両方を指定し、楕円を生成します。
24	g	Element, Reference, Référence, SVG, SVG Container, SVG Element, Élément
		g 要素はオブジェクトをグループ化するためのコンテナです。g 要素に適用された変形はその全ての子要素に対して実行されます。適用された属性は子要素に継承されます。加えて、複雑なオブジェクトを g 要素を使って定義しておくと後に <use> 要素で参照することができます。
25	line
		line要素はSVGの基本図形であり、2つの座標を繋いた直線を描画します。
26	linearGradient
		linearGradient要素はグラフィック要素の塗りまたは線への線形グラデーションを定義します。
27	metadata
		メタデータはデータに関する構造化データです。SVGコンテンツに含まれているメタデータは、 metadata 要素で指定する必要があります。  metadata 要素の内容はRDF,FOAFなどの他のXML名前空間からの要素でなければなりません。
28	polygon
		polygon要素は、全てが繋がった直線とセグメントで構成された閉じた図形を定義します。
29	polyline
		polyline要素はSVGの基本図形であり、いくつかの座標で繋がった一連の直線を生成します。一般的にpolyline要素は開いた図形を生成する際に使用します。
30	radialGradient
		radialGradient要素はグラフィックス要素の塗りまたは線への放射状グラデーションを定義します
31	rect
		rect 要素はSVGの基本図形であり、四角形を生成する際の基準となる座標と、そこからの幅と高さを指定します。また、角の丸まった四角形を作ります。
32	set
		set 要素は指定された時間の間の属性の値を設定します。この要素はすべての属性タイプをサポートしており、合理的に保管することができないものも含みます。例えば、文字列や論理型といった値です。set 要素は非加算的要素です。 The additive and accumulate attributes are not allowed, and will be ignored if specified.
33	svg	Element, SVG, SVG Container, SVG Element, Élément
		svg 要素は、ルート要素でない場合、スタンドアローンな SVG の断片を現在のドキュメント（例えば HTML ドキュメント）の中にネストするために使われます。このスタンドアローンな断片は独自のビューポートと座標系を持ちます。
34	title
		SVGで描画された各コンテナ要素やグラフィックス要素には title 説明文 を供給することができ、記述はテキストのみとなります。 SVGドキュメントが視覚メディアとしてレンダリングされる際、title 要素はグラフィックとしてはレンダリングされません。しかしながら、いくつかのユーサーエージェントは例えば、ツールチップとして title 要素を表示することができます。 Alternate presentations are possible, both visual and aural, which display the title element but do not display path elements or other graphics elements. title 要素は一般的にはSVGドキュメントの可読性を向上させます。
35	use	Element, NeedsBrowserCompatibility, NeedsExample, Reference, Référence, SVG, SVG Graphics, Élément
		use 要素は SVG ドキュメントの中のノードを別の場所に重複させます。効果はあたかもノードが見えない DOM に深くクローンされて、use 要素がある場所に貼り付けられたのと同じです（無名コンテンツと XBL にとても似ています）。クローンされたノードは見えないので、CSS を使って use 要素とその隠れた子孫要素にスタイル付けをする場合は注意が必要です。CSS 属性がクローンされた隠れた要素に継承されることは保証されないので、属性の継承を CSS の inheritance を用いて明示することが必要です。
36	SVG 関連ドキュメントの索引	Index, SVG, index
		{{Index("/ja/docs/Web/SVG")}}
37	スクリプティング	SVG
		No summary!
38	チュートリアル	MDC Project, NeedsContent, SVG, SVG:Tutorial
		Scalable Vector Graphics (SVG) はグラフィックスをマークアップするための、W3C の XML 派生言語です。これは Firefox、Opera、WebKit ブラウザ、Internet Explorer 等のブラウザで部分的にサポートされています。
39	Basic Shapes
		ほとんどの SVG 描画では、数種類の基本的な図形が使われます。それら図形の用途は、その名前からかなり明確です。図形の位置やサイズを指定する属性をいくつか示しますが、要素リファレンスにはここで網羅しない他のプロパティも含めて正確で完全な説明があるでしょう。しかし、それらはほとんどの SVG ドキュメントで用いられますので、何らかの形で紹介することが必要でしょう。
40	Basic Transformations	SVG, SVG:Tutorial
		これまで作成してきた美しい画像を変形させる準備ができました。しかし始めに、<g> 要素を正式に紹介しましょう。このヘルパーを用いると、要素のセット全体にプロパティを割り当てることができます。実際のところ、これが唯一の用途です。例を示します:
41	Fills and Strokes	SVG, SVG:Tutorial
		全種類の図形を描く方法を知ることができましたので、次の目標はそれらに色をつけることでしょう。これを行う方法はいくつかあり、オブジェクトの属性で指定、インライン CSS の利用、埋め込んだ CSS セレクタの利用、外部 CSS ファイルの利用が含まれます。Web で見かけるほとんどの SVG はインライン CSS を用いていますが、どの方法にも利点と欠点があります。
42	Filter effects	SVG, SVG:Tutorial
		基本的な図形は、ある効果を得るために必要な柔軟性を持っていない場合があります。一般的な例として、影を落とす効果はグラデーションの組み合わせで無理なく作成することができません。フィルタは、複雑な効果を与えることを可能にする SVG の機能です。
43	Getting Started	SVG, SVG:Tutorial
		簡単な例で正しく始めましょう。下のコードを見てください。
44	Gradients	SVG, SVG:Tutorial
		単純な塗りつぶしや枠線より面白いであろう効果として、fill や stroke にグラデーションを作成および適用できます。
45	Introduction	SVG, SVG:Tutorial
		SVG は右に示したようなグラフィックの描画に用いる、 XHTML に似ている XML 言語です。これは、必要な線や図形を指定する、既存のラスタ画像に手を加える、あるいはそれら両方を組み合わせることで画像を作成するのに用いられます。画像やその部品は、外見を完全に変えるためにトランスフォーム、合成、フィルタ適用を行うこともできます。
46	Other content in SVG	SVG, SVG:Tutorial
		長方形や円といったグラフィックの基本要素とは別に、SVG は画像内に他の種類のコンテンツを埋め込むための要素セットも同様に用意しています。
47	Paths
		前のセクションで述べたとおり、<path> 要素は SVG の基本的な図形の中でもっとも強力な要素です。これは、(少なくともよく似ている) 他のすべての図形などを作成するために用いることができます。
48	Patterns	SVG, SVG:Tutorial
		私見では、パターンは SVG で用いる中でわかりにくい塗りつぶし方のひとつです。とはいえとても強力であるので、パターンには説明および少なくとも基礎的な部分は把握するだけの価値があります。グラデーションと同様に、<pattern> 要素は SVG ファイルの <defs> セクションに置かなければなりません。
49	Positions	SVG, SVG:Tutorial
50	SVG Fonts	SVG, SVG:Tutorial
		SVG で Web フォントのサポートが明示されたのは、それがずっと望まれていたからです。しかし画像のレンダリングには正しいフォントが重要であるため、SVG にフォントを定義する技術が追加されました。これは PostScript や OTF のような他のフォント形式と同じようなものを意図するのではなく、レンダリングエンジン向けにグリフ情報を埋め込む簡単な手段です。
51	SVG Image Tag	NeedsEditorialReview, NeedsTechnicalReview
		SVG の image 要素は、ラスタイメージを SVG オブジェクト内に描画することを可能にします。
52	SVG のツール
		SVG の内部の基礎を説明しましたので、ここでは SVG ファイルで作業を行うためのツールをいくつか見ていきましょう。
53	Texts	SVG, SVG:Tutorial
		SVG でのテキストについて説明するにあたり、これをほとんど別物である 2 つのトピックに区別しなければなりません。ひとつは画像内へのテキストの収容と表示、もう一つは SVG フォントです。後者はこのチュートリアルの後のセクションで説明することにして、ここでは一つ目の部分 "SVG 画像へのテキスト入力" に集中します。
54	クリッピングとマスキング	SVG, SVG:Tutorial
		苦労して作成したオブジェクトの一部を消去することは、一見矛盾しているように見えます。ところが SVG で半円を作成しようとすると、以下のプロパティを使うことにすぐ気がつくでしょう。
55	名前空間の速修講座	SVG, XML
		XML の派生言語として、 SVG は名前空間付けられています。もしあなたが SVG コンテンツを作成する予定なら名前空間の概念と使い方を理解することは重要です。 Firefox 1.5 リリースより前の幾つかのバージョンの SVG ビューワは残念ながら名前空間に対して十分な注意を払いませんが、 とても厳格でなくてならない Gecko ベースのブラウザのようなユーザエージェントが複数の XML 派生言語をサポートするために不可欠です。今、名前空間を理解するためにいくらかの時間をとり、将来頭を悩ませる時間を節約しましょう。
56	例	SVG, XML
		この例で、私達は XHTML 、 SVG 、 JavaScript と DOM 2 を「ほこり」の群れを動かすのにつかっています。これらのほこりは 2 つの簡単な法則によって制御されています。1 つめは、それぞれのほこりがマウスカーソルの方向に向かって移動しようとします。2 つ目はそれぞれのほこりはほこりの位置の平均から遠ざかろうとします。組み合わせることで、このとても自然に見える動きができます。