SVG の実装には、この章で述べる描画（画像化）モデルに従って実装されているかのようにふるまうことが求められている。 現実の実装がこのモデルに従わなくてもよいが、実装でサポートされるすべての装置に現れる結果は，このモデルに適合しなければならない。 Implementations of SVG are expected to behave as though they implement a rendering (or imaging) model corresponding to the one described in this chapter. A real implementation is not required to implement the model in this way, but the result on any device supported by the implementation shall match that described by this model.
【 描画（ rendering ）：この仕様の和訳全体を通して，語「描画」は，いわゆる（グラフィックの視覚的な）“レンダリング” を意味する（ rendering, render の対訳に用いられる）。 「描画」が他の意味で用いられることはない。 】
付録 適合性の要件 において、現実の実装がここでの記述から逸脱してもよい範囲を述べる。 現実問題として、出力装置の限界（例えば、表現可能な色の範囲が限られているかもしれない），あるいは精度の数学モデルを実装するにあたっての実用上の限界（例えば、実行に際しては要求されている基準が満たされる程度に曲線を直線で近似させる，など）により、実装が多少異なってくることが予想される。 The appendix on conformance requirements describes the extent to which an actual implementation may deviate from this description. In practice an actual implementation will deviate slightly because of limitations of the output device (e.g. only a limited range of colors might be supported) and because of practical limitations in implementing a precise mathematical model (e.g. for realistic performance curves are approximated by straight lines, the approximation need only be sufficiently precise to match the conformance requirements).
SVG の描画では「画家のモデル」が用いられる。 出力装置に対する一連の操作は 塗り の適用により行われる。 各々の操作は、出力装置のある領域に対する塗りである。 領域が前の操作による領域と重なりあう場合は、前の塗りが部分的に, あるいは完全に隠される。 塗りが完全に不透明でなければ、出力装置に現れる結果は アルファ混色 にて述べる（数学的な）組成規則に従う。 SVG uses a "painters model" of rendering. Paint is applied in successive operations to the output device such that each operation paints over some area of the output device. When the area overlaps a previously painted area the new paint partially or completely obscures the old. When the paint is not completely opaque the result on the output device is defined by the (mathematical) rules for compositing described under Alpha Blending.
SVG 文書片の要素には暗黙の塗り順序がある。 文書片に現れる最初の要素が最初に「塗られる」。 後続の要素は前に塗られた要素の上に塗られる。 Elements in an SVG document fragment have an implicit drawing order, with the first elements in the SVG document fragment getting "painted" first. Subsequent elements are painted on top of previously painted elements.
g などの，要素をグループ化する要素 （コンテナ要素 を見よ）の描画においては、まず，黒地透明（ transparent black ）に初期化された一時的なキャンバスが別途作成され，その上にすべての子要素が塗られる。 次に，グループに フィルタ効果 が指定されているならば、それらが一時的キャンバスに適用され，キャンバスは変更される。 変更された一時的キャンバスは、グループレベルの マスキング とグループに指定された 不透明度 が計算に織り込まれた上で，背景に組成される。 Grouping elements such as the ‘g’ element (see container elements) have the effect of producing a temporary separate canvas initialized to transparent black onto which child elements are painted. Upon the completion of the group, any filter effects specified for the group are applied to create a modified temporary canvas. The modified temporary canvas is composited into the background, taking into account any group-level masking and opacity settings on the group.
個々の グラフィックス要素 は、あたかもそれ自身が一つのグループをなすものとして描画される。 したがって、グラフィックス要素ごとに，別々の一時的なキャンバスが用意されることになる。 グラフィックス要素は、最初に一時的なキャンバスに塗られた後（下の 図形とテキストの塗り と ラスター画像の塗り を見よ），その要素に指定された フィルタ効果 が適用され、変更された一時的なキャンバスは，その要素に指定された クリッピング, マスキング, オブジェクトの不透明度 が計算に織り込まれた上で，背景に組成される。 Individual graphics elements are rendered as if each graphics element represented its own group; thus, the effect is as if a temporary separate canvas is created for each graphics element. The element is first painted onto the temporary canvas (see Painting shapes and text and Painting raster images below). Then any filter effects specified for the graphics element are applied to create a modified temporary canvas. The modified temporary canvas is then composited into the background, taking into account any clipping, masking and object opacity settings on the graphics element.
SVG においては、キャンバスへ描画され得るものとして，３種類の基本的な グラフィックス要素 がサポートされている： SVG supports three fundamental types of graphics elements that can be rendered onto the canvas:
図形とテキストには、 フィル 操作（塗りを図形の内部に適用すること），および ストローク 操作（塗りを図形の外形線に適用すること）が可能である。 ストローク操作では オブジェクトの外形線がその中央線に据えられる。 その結果、塗りの半分は図形の内部になされ，残り半分は図形の外部になされる。 Shapes and text can be filled (i.e., apply paint to the interior of the shape) and stroked (i.e., apply paint along the outline of the shape). A stroke operation is centered on the outline of the object; thus, in effect, half of the paint falls on the interior of the shape and half of the paint falls outside of the shape.
ある種の図形には、指定した頂点に マーカシンボル （それ自身、図形, テキスト, 画像 の任意の組み合わせから構成され得る）を描くことができる。 それぞれのマーカシンボルは、あたかも SVG 文書木において，そのグラフィック内容がそれを利用している図形の直後に挿入されたかのように，塗られる。 マーカシンボルのグラフィック内容は、グラフィックス要素と同じ方法で描画される。 マーカシンボルはテキストには適用できない。 For certain types of shapes, marker symbols (which themselves can consist of any combination of shapes, text and images) can be drawn at selected vertices. Each marker symbol is painted as if its graphical content were expanded into the SVG document tree just after the shape object which is using the given marker symbol. The graphical contents of a marker symbol are rendered using the same methods as graphics elements. Marker symbols are not applicable to text.
最初にフィル, 次にストローク, 最後にマーカシンボルが塗られる。 各マーカシンボルは 図形の外形線に沿って, 始点から終点に向かう順番で塗られる。 The fill is painted first, then the stroke, and then the marker symbols. The marker symbols are rendered in order along the outline of the shape, from the start of the shape to the end of the shape.
フィルとストロークは それぞれ別々の不透明度を持つ。 したがって, 図形においては、フィルとストローク操作に対し，不透明度の異なる色を別々に指定することができる。 Each fill and stroke operation has its own opacity settings; thus, you can fill and/or stroke a shape with a semi-transparently drawn solid color, with different opacity values for the fill and stroke operations.
フィルとストローク操作は互いに全く独立した塗り操作である。 したがって，図形に対してフィルとストロークの両方を行った場合、ストロークの半分はフィルを上塗りする。 The fill and stroke operations are entirely independent painting operations; thus, if you both fill and stroke a shape, half of the stroke will be painted on top of part of the fill.
SVG では、フィルとストローク操作に適用できる塗りとして，次の種類のものが組み込まれている： SVG supports the following built-in types of paint which can be used in fill and stroke operations:
ラスター画像が描画される際には、出力装置上の領域に合わせた標本を生成をするために，元の標本が標準的なアルゴリズムを用いて「再標本化」される。 再標本化における要件は 適合性の要件 にて論じられる。 When a raster image is rendered, the original samples are "resampled" using standard algorithms to produce samples at the positions required on the output device. Resampling requirements are discussed under conformance requirements.
SVG においては、任意の塗り操作に対し, フィルタを適用することができる（ フィルタ効果 を見よ）。 SVG allows any painting operation to be filtered. (See Filter Effects.)
この場合、まず，塗り操作が黒地透明に初期化された中間処理用キャンバスになされる。 キャンバスの大きさは フィルタ効果 で与えられる規則に従って定められる。 しかる後， フィルタ効果 に定義される処理を適用したものが結果となる。 In this case the result must be as though the paint operations had been applied to an intermediate canvas initialized to transparent black, of a size determined by the rules given in Filter Effects then filtered by the processes defined in Filter Effects.
SVG においては、任意の塗り操作に対し，その領域をクリッピングとマスキングを用いて出力装置の一部分に限定させることができる。 詳細は クリッピング, マスキング, 組成法 にて述べる。 SVG allows any painting operation to be limited to a subregion of the output device by clipping and masking. This is described in Clipping, Masking and Compositing.
クリッピングにおいては、塗りの対象となる出力装置の領域を定義するパスが利用される。 クリッピングの適用下における塗り操作では、出力装置のクリッピング領域のみが影響を受ける。 クリッピングパスを次のように考えることもできる： それは一種のマスクであり，領域外の画素はアルファ値ゼロの黒, 領域内の画素はアルファ値 1 の白となっているものである。 塗り操作におけるクリッピングの「内部」は、パスの内部を定義する規則と同じ規則により定義される。 低解像度の出力装置においては、概して，クリッピングパスにアンチエイリアス処理が施される（ shape-rendering プロパティを見よ）。 クリッピングについては クリッピングパス にて述べる。 Clipping uses a path to define a region of the output device to which paint can be applied. Any painting operation executed within the scope of the clipping must be rendered such that only those parts of the device that fall within the clipping region are affected by the painting operation. A clipping path can be thought of as a mask wherein those pixels outside the clipping path are black with an alpha value of zero and those pixels inside the clipping path are white with an alpha value of one. "Within" is defined by the same rules used to determine the interior of a path for painting. The clipping path is typically anti-aliased on low-resolution devices (see ‘shape-rendering’. Clipping is described in Clipping paths.
マスキングにおいては、まず，参照されている SVG 要素の色チャンネルとアルファチャンネルの輝度を利用して，マスク処理に用いるためのアルファ値が生成され、そのアルファ値がマスクを適用するグラフィックのアルファ値に掛け合わせられる。 マスキングについては マスキング にてとりあげる。 Masking uses the luminance of the color channels and alpha channel in a referenced SVG element to define a supplemental set of alpha values which are multiplied to the alpha values already present in the graphics to which the mask is applied. Masking is described in Masking.
一連の描画操作に対し, 「大域的な」不透明度を適用することにより、マスキング演算を追加指定することもできる。 この場合のマスクは、与えられた不透明度のアルファチャンネルと白色の色チャンネルを持つ，広さ無限の領域である（ opacity プロパティを見よ）。 A supplemental masking operation may also be specified by applying a "global" opacity to a set of rendering operations. In this case the mask is infinite, with a color of white and an alpha channel of the given opacity value. (See the ‘opacity’ property.)
いかなる場合においても, SVG の実装は、あたかも すべての塗り操作とフィルタ演算が黒地透明に初期化された中間処理用のキャンバスに対して最初に実行されたかのように，ふるまわなければならない。 しかる後、中間処理用のキャンバスのアルファ値に，クリッピングパスによる暗黙のアルファ値, マスクのアルファ値, opacity プロパティのアルファ値が 順に掛け合わされる。 この処理結果のキャンバスが 単純アルファ組成法 により背景に組成される。 したがって，グループ不透明度 50% の下に，不透明な赤色に続いて不透明な緑色が塗られた場合、出力装置における結果は，不透明度 50% の緑色で塗られたときと同じになる。 何故なら、出力装置に中間キャンバスが描画される前の段階で，中間キャンバス上においては不透明な緑色が赤色の塗りを完全に覆うからである。 In all cases the SVG implementation must behave as though all painting and filtering is first performed to an intermediate canvas which has been initialized to transparent black. Then, alpha values on the intermediate canvas are multiplied by the implicit alpha values from the clipping path, the alpha values from the mask, and the alpha values from the ‘opacity’ property. The resulting canvas is composited into the background using simple alpha blending. Thus if an area of the output device is painted with a group opacity of 50% using opaque red paint followed by opaque green paint the result is as though it had been painted with just 50% opaque green paint. This is because the opaque green paint completely obscures the red paint on the intermediate canvas before the intermediate as a whole is rendered onto the output device.
SVG 文書片は半透明にすることもできる。 多くの環境において（例えばウェブブラウザなど），最終的な組成の段階で、 SVG 文書片がそれ全体として半透明にされた上で，背景のキャンバス上へ混色される。 SVG document fragments can be semi-opaque. In many environments (e.g., Web browsers), the SVG document fragment has a final compositing step where the document as a whole is blended translucently into the background canvas.