Von SVG-Implementationen wird erwartet, sich so zu verhalten, als würden sie ein Rendermodell bzw. Bildmodell implementieren, wie es in diesem Kapitel beschrieben ist. Eine reale Implementation muss das Modell nicht in dieser Weise unterstützen, aber das Ergebnis auf jedem Gerät, das von der Implemetation unterstützt wird, sollte dem beschriebenen Ergebnis in diesem Kapitel entsprechen.
Der Anhang über Konformitätsanforderungen beschreibt den Umfang, um den eine tatsächliche Implementation von dieser Beschreibung abweichen darf. In der Praxis wird eine tatsächliche Implementation auf Grund von Beschränkungen des Ausgabegeräts leicht abweichen (z.B. wird nur ein bestimmter Farbbereich unterstützt) und weil praktische Beschränkungen in der Implementation eines präzisen mathematischen Modells bestehen (z.B. für realistische Performance werden Kurven durch gerade Linien angenähert, die Annäherung muss nur genügend präzise sein, um die Konformitätsanforderungen zu erfüllen).
SVG verwendet ein "Painters-Modell" beim Rendern. Farbe (paint) wird in aufeinander folgenden Operationen am Ausgabegerät in der Weise aufgetragen, dass jede Operation einen Bereich des Ausgabegeräts übermalt. Wenn der Bereich einen bereits bemalten Bereich überlappt, überdeckt die neue Farbe die alte ganz oder teilweise. Wenn die Farbe nicht hundertprozentig deckend ist, wird das Ergebnis auf dem Ausgabegerät durch die (mathematischen) Regeln für die Mischung definiert, die unter Einfaches Alpha Blending beschrieben sind.
Elemente in einem SVG-Dokument haben eine implizite Reihenfolge, in der sie gemalt werden. Das erste Element in einem SVG-Dokumentfragment wird als erstes gemalt. Darauffolgende Elemente werden auf die Oberfläche der zuvor gemalten Elemente aufgetragen.
Gruppierende Elemente wie 'g' (siehe Container-Elemente) produzieren einen temporären eingenständigen Canvas, der in transparentem Schwarz initialisiert wird, auf welchen Kind-Elemente gemalt werden. Nachdem die gesamte Gruppe gemalt ist, werden alle für die Gruppe angegebenen Filtereffekte angewendet, um einen veränderten temporären Canvas zu erzeugen. Der veränderte temporäre Canvas wird unter Berücksichtigung der gruppenbezogenen Einstellungen für das Masking und die Deckfähigkeit dieser Gruppe in den Hintergrund integriert.
Einzelne Grafikelemente werden so gerendert, als sei jedes Grafikelement seine eigene Gruppe; im Klartext bedeutet das, dass für jedes Grafikelement ein eigener temporärer Canvas gebildet wird. Das Element wird zuerst auf den temporären Canvas gemalt (siehe Formen und Text malen und Rasterbilder malen unten). Dann werden alle Filter Effekte angewendet, die für das Grafikelement angegeben sind, um den veränderten temporären Canvas zu erzeugen. Der veränderte temporäre Canvas wird anschließend unter Berücksichtigung aller Einstellungen für Clipping, Masking und die Objektdeckfähigkeit des grafischen Elements in den Hintergrund integriert.
SVG unterstützt drei grundlegende Grafikelementtypen, die auf dem Canvas gerendert werden können:
Formen und Text können gefüllt (fill) (z.B. dem Inneren einer Form Farbe
geben) und gestrichen (stroke)
werden (z.B. einer Aussenlinie einer Form Farbe geben).
Eine stroke-Operation ist auf die Außenlinie
eines Objekts zentriert; so fällt die eine Hälfte der
Farbe auf das innere der Form, die andere Hälfte auf die
äußere Seite der Form.
Für bestimmte Formtypen können Markersymbole (die selbst aus einer Kombination von Formen, Text und Bildern bestehen können) auf ausgewählte Scheitelpunkte gemalt werden. Jedes Markersymbol wird so gemalt, als würde sein grafischer Inhalt im SVG-Dokumentenbaum ergänzt, gleich nach dem Formobjekt, welches das gegebene Markersymbol verwendet. Die grafischen Inhalte eines Markersymbols werden nach den gleichen Verfahren gerendert, die auch für Grafikelemente verwendet werden. Markersymbole sind nicht auf Text anwendbar.
Zuerst wird die Operation fill gemalt, dann
stroke und schließlich die Markersymbole.
Die Markersymbole werden der Reihe nach entlang der Außenlinie
der Form gerendert, vom Anfang der Form bis zum Ende der Form.
Jede fill- und jede stroke-Operation hat
eigene Angaben für ihren Deckungsgrad; so kann man eine Form
mit einer semi-transparent gemalten festen Farbe
füllen oder
streichen, mit verschiedenen
Werten für den Deckungsgrad der fill- und
stroke-Operationen.
Die Operationen fill und stroke sind
zwei gänzlich unabhängige Operationen; wenn sie also
eine Form sowohl füllen als auch streichen, wird die Hälfte
des Pinselstrichs (stroke) auf einem Teil der gefüllten
Fläche (fill) gemalt.
SVG unterstützt die folgenden integrierten Farbtypen, die in
fill- und stroke-Operationen verwendet
werden können:
Wird ein Rasterbild gerendert, werden die originalen Muster mit Standardalgorithmen "resampled", um ein Muster an der erforderlichen Stelle im Ausgabegerät zu erstellen. Die Anforderungen an den Resampling-Vorgang werden unter Konformitätsanforderungen besprochen.
Mit SVG kann jede Maloperation gefiltert werden. (Siehe Filtereffekte.)
In diesem Fall muss das Ergebnis so ausfallen, als seien die Maloperationen auf einem temporären Canvas angewendet worden, der in transparentem Schwarz initialisiert wurde. Die Größe muss anhand der in Filtereffekte gegebenen Regeln ermittelt werden mit einem anschließenden Filtervorgang wie in Filtereffekte beschrieben.
SVG erlaubt, die Maloperation auf einen begrenzten Bereich innerhalb des Ausgabegeräts mit Hilfe von Ausschneiden und Maskieren zu beschränken. Dies ist beschrieben in Ausschneiden, Maskieren und Zusammenfügen
Ausschneiden verwendet einen Pfad, um einen Bereich des Ausgabegeräts zu definieren, dem Farbe zugefügt werden kann. Die Maloperation, die innerhalb des ausgeschnittenen Bereichs ausgeführt wird, muss so gerendert werden, dass nur die Teile des Gerätes von der Maloperation betroffen werden, die innerhalb des ausgeschnittenen Bereichs fallen. Ein ausgeschnittener Pfad (clipping path) kann so ausfallen wie eine Maske, in der die Pixel außerhalb des ausgeschnittenen Pfads schwarz sind, mit dem Alpha-Wert Null, und die Pixel innerhalb des ausgeschnittenen Pfads weiß sind, mit dem Alpha-Wert eins. "Innerhalb" wird durch die gleichen Regeln definiert, die auch das Innere eines Pfads für den Malvorgang bestimmen. Der ausgeschnittene Pfad wird auf niedrig auflösenden Geräten normalerweise anti-aliased gemalt (siehe 'shape-rendering'). Ausschneiden wird beschrieben in Pfade ausschneiden.
Masking (maskieren) verwendet die Leuchtkraft der Farbkanäle und des Alphakanals in einem referenzierten SVG-Element, um ergänzende Alphawerte zu definieren, die mit den vorhandenen Alphawerten der Grafik, auf welche die Maske angewendet werden soll, multipliziert werden. Maskieren wird in Maskieren beschrieben.
Eine ergänzende Maskierungsoperation kann auch durch die Zuweisung einer "globalen" Deckfähigkeit für eine Reihe von Renderoperationen angegeben werden. In diesem Fall ist die Maske unbegrenzt, die Farbe ist weiß und der Alphakanal entspricht dem gegebenen Wert für die Deckfähigkeit. (Siehe 'opacity'-Eigenschaft.)
In allen Fällen muss sich die SVG-Implementation so verhalten, als seien alle Mal- und Filtervorgänge zuerst auf einen temporären Canvas angewendet worden, der in transparentem Schwarz initialisiert wurde. Dann werden werden die Alphawerte des temporären Canvas mit den impliziten Alphawerten des ausgeschnittenen Pfads, den Alphawerten der Maske und den Alphawerten der 'opacity'-Eigenschaft multipliziert. Der daraus resultierende Canvas wir mit Hilfe einfachen Alpha-Blendings in den Hintergrund eingefügt. Wird demnach ein Bereich im Ausgabegeräts mit einer Gruppendeckfähigkeit von 50% gemalt, und in der Gruppe zunächst deckend rot und dann deckend grün verwendet, so erscheint das Ergebnis, als wäre der Bereich nur mit 50% Grün gemalt worden, da die deckende grüne Farbe die rote Farbe im temporären Canvas vollkommen überdeckt, bevor der tempöräre Canvas als Ganzes im Ausgabegerät gerendert wird.
SVG-Dokumentfragmente können halb-deckend (semi-opaque) sein. In vielen Umgebungen (z.B. in Webbrowsern) gibt es einen abschließenden zusammenführenden Schritt, in dem das Dokument als Ganzes durchsichtig in den Hintergrund-Canvas gemischt wird.