Beispiele und Tests zur Animation mit SVG

Animierbare SVG-Filter-Attribute und -Eigenschaften, nicht Teil von SVG tiny

Filtereffekte

Amaya 9.51/11.3.1, KSVG 1, WebKit 528.16 und Opera 8.x ignorieren Filtereffekte komplett, daher werden diese nicht getestet. Squiggle 1.7 zeigt die meisten Filter an, animiert sie aber nicht. Nur eine Eigenschaft wird animiert, dies wird als Testergebnis angegeben, alle anderen Tests schlagen fehl.

Anzumerken ist, daß Filtereffekte meistens nur nützlich sind, wenn sie mit anderen kombiniert werden. Der Effekt zahlreicher Einzelfilter kann oft einfacher durch andere Elemente und Methodes von SVG realisiert werden, aber die Kombination verschiedener Urfilter kann zu interessanten zusätzlichen Effekten führen. Auch einige einzelne Urfilter können bereits interessante Effekte nach sich ziehen, ohne mit anderen Filtern kombiniert zu werden. Hier werden die Effekte nur getestet, daher sind die meisten Beispiele einfach und ohne komplizierte Kombinationen mehrerer Filter. Die Kombination verschiedener Filter kann allerdings zu zusätzlichen Problemen führen, die hier noch nicht im Zentrum des Interesses stehen.
Oft ist es nicht einfach, korrektes Verhalten von Urfiltern quantitativ zu testen. Daher sind die meisten Tests nur qualitativ. Wenn Unterschiede zwischen den Darstellungen verschiedener Programme auftreten, könnte dies ein Hinweis auf einen quantitativen Fehler in einem oder beiden Darstellungsprogrammen sein.

Attribute spezifisch für das Filterelement

e2005-12-18-01: §P
set-Animation des Attributes filterUnits:
filterUnits wird nach 3s für 5s von objectBoundingBox zu userSpaceOnUse animiert. In dieser Situation bedeutet das, der Filter feGaussianBlur wird erst nur auf den Kreis in der Mitte des SVG angewendet, dann aber expandiert der Filter über die komplette viewBox und nach 5s springt es zurück zur anfänglichen kleineren Struktur.
Ein grau gerandetes Quadrat deutet die Filterregion an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1ko Keine Anzeige für objectBoundingBox, der Wechsel zu userSpaceOnUse mit der set-Animation funktioniert.
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0ko keine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-18-02: §Q
set-Animation des Attributes primitiveUnits:
primitiveUnits wird nach 3s für 5s von objectBoundingBox zu userSpaceOnUse animiert. In dieser Situation bedeutet das, der Filter feGaussianBlur wird erst nur auf den Kreis in der Mitte des SVG angewendet, dann aber expandiert der Filter über die komplette viewBox und nach 5s springt es zurück zur anfänglichen kleineren Struktur.
Die Filterprimitivsubregion wird mit einem grau gerandeten Quadrat gekennzeichnet. Zu beachten ist, daß auch die Standardabweichung von feGaussianBlur bei der Animation verändert wird.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoFilterprimitivsubregion falsch
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0koStandardabweichung von feGaussianBlur unverändert
Opera10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok -

e2005-12-18-03: §P
Animation der Attribute x und y:
x und y werden 5s lang animiert und dann eingefroren. Sie werden von 0 zu 0.5 modifiziert, was von oben links zur Mitte bedeutet.
Ein grau gerandetes Quadrat kennzeichnet den Filterbereich in userSpaceOnUse.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Anzeige
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0ko keine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-06-01: §P
Animation der Attribute x und y:
x und y werden 5s lang animiert und dann eingefroren. Sie werden von 0 zu 0.5 modifiziert, was von oben links zur Mitte bedeutet.
Ein grau gerandetes Quadrat kennzeichnet den Filterbereich in objectBoundingBox.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Anzeige
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0ko keine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-18-04: §P
Animation der Attribute width und height:
width und height werden 5s lang animiert und dann eingefroren. Sie werden von 0 zu 1 modifiziert, was bedeutet von einer kompletten Anzeige nach oben links.
Ein grau gerandetes Quadrat kennzeichnet den Filterbereich in userSpaceOnUse.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0ko keine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-07-01: §P
Animation der Attribute width und height:
width und height werden 5s lang animiert und dann eingefroren. Sie werden von 0 zu 1 modifiziert, was bedeutet von einer kompletten Anzeige nach oben links.
Ein grau gerandetes Quadrat kennzeichnet den Filterbereich in objectBoundingBox.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0ko keine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-18-05: §Q
Animation des Attributes filterRes:
filterRes wird 30s lang animiert und eingefroren. Die Werte 1 5;10 500;100 50;400 200; 500 500 werden genutzt, was eine Verfeinerung der Filterauflösung bedeutet. Zu beachten ist, daß sich bei den ersten Werten die Auflösung für x und y unterscheidet. Ein schwarz gerandetes Rechteck oben links mit grob der gleichen Breite und Höhe wie ein Filterpunkt wird als Vergleich angeboten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Opera9tp2/ beta1/2koAttribut ignoriert
Gecko 2.0ko keine Animation
Gecko 8.0/ 24.0/ 36.0/ 48.0ko Filterbereich falsch
Gecko 12.0ok -
Gecko 48.0koAttribut ignoriert

e2009-07-11-01: §Q
Animation des Attributes filterRes:
filterRes wird 60s diskret animiert und dann eingefroren. Es wird mit folgenden Werten verändert: 0.5;1 1;2 2;3 3;4 4;5 5;6 6;7 7;8 8;9 9;10 10;11 11;12 12;8 4;2 4;4 2;4.2 4.8.
Der Filter wird auf ein kariertes Gebiet mit 16 Quadraten angewendet. Das Raster wird zum Vergleich schwarz gemalt angedeutet. Für ein filterRes von 4, 8 oder 12 (etc) paßt das gefilterte Muster exakt ins Raster, für andere filterRes müssen Überbleibsel der nicht passenden Auflösung zu erkennen sein. Wegen der Symmetrien des karierten Musters ist das Ergebnis der filterRes 0.5, 1, 2, 2 4, 4 2 nur eine Farbe (die gleiche für alle) für das komplette Gebiet.
Graue Rechtecke oben links geben die Größe einer Filtereinheit entsprechend filterRes an. Man beachte, daß die Spezifikation nicht fordert, daß es sich um positive, ganze Zahlen handelt, nur um Zahlen.

Test results
user-agentresultcomment
W3C-ValidatorokSVG 1.1
AdobekoDie resultierenden Farben sehen falsch aus, zum Beispiel sollte '2 4' und '4 2' in nur eine Farbe für das gesamte Gebiet resultieren
Opera9tp1/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00koDie resultierenden Farben sehen falsch aus, zum Beispiel sollte '2 4' und '4 2' in nur eine Farbe für das gesamte Gebiet resultieren
Opera9tp2/ beta1/2koAttribut ignoriert
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0ko keine Animation
Gecko 48.0koAttribut ignoriert

e2005-12-18-06: §M(1)P
Animation des Attributes xlink:href:
xlink:href wird nach 3s für 5s zu einer anderen Filterquelle gewechselt, wodurch sich in dieser Zeit eine andere Verschiebung ergibt.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeko Attribut ignoriert
Opera9tp1ko Attribut ignoriert
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00kokleinerer Verschiebungsfehler
Gecko 2.0/ 8.0/ 12.0ko Attribut ignoriert
Gecko 24.0/ 36.0/ 48.0ok -
Testergebnisse Attribute spezifisch für das Element filter
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 6/9
Opera9tp1 4/9
Opera9tp2/ beta1/2 5/9
Opera9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 6/9
Opera10.60/ 11.00/11.60/ 12,00 7/9
Gecko 2.0 1/9
Gecko 8.0 6/9
Gecko 12.0/ 24.0/ 36.0/ 48.0 7/9

Die Eigenschaft filter

e2005-12-18-21: §M(1)P
Animation der Eigenschaft filter:
Die Eigenschaft filter wird nach 3s für 5s zu einer anderen Filterquelle gewechselt, wodurch sich in dieser Zeit eine andere Verschiebung ergibt.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Squiggle 1.7ok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00kokleinerer Verschiebungsfehler
Gecko 2.0/ 8.0koeigenartiger Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

Urfilter

Gemeinsame Attribute der Urfilter

e2005-12-19-01: §P
Animation der Attribute x und y eines Urfilters:
x und y von feGaussianBlur werden 5s lang verändert und dann eingefroren. Sie gehen von 0 nach 0.5, also von oben links zur Mitte.
Ein grau gerandetes Quadrat kennzeichnet den Urfilterunterbereich in userSpaceOnUse.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-08-01: §P
Animation der Attribute x und y eines Urfilters:
x und y von feGaussianBlur werden 5s lang verändert und dann eingefroren. Sie gehen von 0 nach 0.5, also von oben links zur Mitte.
Ein grau gerandetes Quadrat kennzeichnet den Urfilterunterbereich in objectBoundingBox.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoAttribut ignoriert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kokleinere Darstellungsprobleme
Gecko 12.0/ 48.0ok-
Gecko 24.0/ 36.0ko falscher Filterbereich

e2005-12-19-02: §P
Animation der Attribute width und height eines Urfilters:
width und height von feGaussianBlur werden 5s lang animiert und dann eingefroren. Sie werden von 0 nach 1 geändert, also von keiner Anzeige zur vollen Bildgröße, ausgehend von oben links.
Ein grau gerandetes Quadrat kennzeichnet den Urfilterunterbereich in userSpaceOnUse.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-09-01: §P
Animation der Attribute width und height eines Urfilters:
width und height von feGaussianBlur werden 5s lang animiert und dann eingefroren. Sie werden von 0 nach 1 geändert, also von keiner Anzeige zur vollen Bildgröße, ausgehend von oben links.
Ein grau gerandetes Quadrat kennzeichnet den Urfilterunterbereich in objectBoundingBox.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoAttribut ignoriert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-19-10: §Q
Animation des Attributes in eines Urfilters:
in von feGaussianBlur wird nach 5 von SourceGraphic auf SourceAlpha gesetzt. Dies ergibt eine Änderung von einer farbigen Graphik zu einer mit Grauwerten und zurück zur Farbe.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-19-11: §Q
Animation des Attributes in eines Urfilters:
in von feGaussianBlur wird in 12s zwischen folgenden Werten gewechselt: SourceGraphic;SourceAlpha;FillPaint;StrokePaint.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0koteilweise fehlende Filterquellen
Gecko 24.0/ 36.0/ 48.0ok-

e2005-12-19-12: §Q
Animation des Attributes in eines Urfilters:
in von feGaussianBlur wird nach 5s für 5s von BackgroundImage auf BackgroundAlpha gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobeokZu beachten ist, daß das Beispiel in der Spezifikation für das Hintergrundbild in Adobe falsch dargestellt wird, dieses einfache Beispiel hier ist hingegen korrekt, auf das Verhalten von Adobe kann man sich bei der Verwendung von BackgroundImage und BackgroundAlpha also nicht verlassen.
Opera9tp1kokeine Animation, aber die Darstellung von BackgroundImage und BackgroundAlpha ist richtig.
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Animation

e2005-12-19-13: §M(1)P
Animation des Attributes in eines Urfilters:
in von feOffset wird zwischen 9 verschiedenen weiteren Urfiltern feOffset mit positiven und negativen Verschiebungen für dx und dy gewechselt.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kokleinere Darstellungsprobleme
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-19-20: §M(1)P
Animation des Attributes result eines Urfilters:
result eines feOffset wird nach 5s für 5s auf den Namen eines frühreren result eines feOffet gesetzt und überschreibt dieses daher. Dies wird als Eingabe eines feOffset verwendet, mit dem sichtbaren Effekt einer Verschiebung für diese 5s.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kokleinere Darstellungsprobleme
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für gemeinsame Attribute
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 7/9
Opera9tp1 4/9
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 9/9
Gecko 2.0/ 8.0 4/9
Gecko 12.0/ 24.0/ 36.0 7/9
Gecko 48.0 8/9

feOffset

feOffset verschiebt gefilterte Objekte um dx und dy relativ zur Position der Quelle.

e2005-12-19-30: §M(1)P
Animation der Atribute dx und dy eines feOffset:
dx und dy eines feOffset werden mit Wiederholung zwischen verschiedenen Werten geändert, woraus sich ein bewegtes Objekt ergibt. Zu beachten ist, daß dx und dy positive und negative Werte haben. Die erste Bewegung verläuft von der Mitte nach oben rechts.
Man beachte, daß dieses Beispiel nur für diese Testzwecke sinnvoll ist, um solche Bewegungen zu realisieren, sollten cx und cy des Kreises animiert werden oder animateTransform oder animateMotion sollten für das betreffende Element oder eine Gruppe genutzt werden und zwar ohne Filter.
In der Spezifikation wird erwähnt, daß dieses speziell genutzt werden kann, um einen verschobenen Schatten zu erzeugen. Man beachte, daß dieses sicher falsch für eine Lichtquelle mit endlichem Abstand ist. In solch einem Falle ist der Schatten nicht nur verschoben, sondern auch skaliert, mal abgesehen von sonstigen komplizierteren Effekten wie etwa Beugung.
Um ein besseres Ergebnis zu erzielen und überhaupt einen Schatten zu bekommen, wenn das Darstellungsprogramm Filter komplett ignoriert, kann es nützlich sein, ein transformiertes (und gefiltertes) use-Element des Originals zu verwenden.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine negativen Werte für dx und dy
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-10-01: §M(1)P
Animation der Atribute dx und dy eines feOffset:
dx und dy eines feOffset mit filterUnits und primitiveUnits userSpaceOnUse werden mit Wiederholung zwischen verschiedenen Werten geändert, woraus sich ein bewegtes Objekt ergibt. Zu beachten ist, daß dx und dy positive und negative Werte haben. Die erste Bewegung verläuft von der Mitte nach oben rechts.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine negativen Werte für dx und dy
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-10-02: §M(1)P
Animation der Atribute dx und dy eines feOffset:
dx und dy eines feOffset mit filterUnits und primitiveUnits objectBoundingBox werden mit Wiederholung zwischen verschiedenen Werten geändert, woraus sich ein bewegtes Objekt ergibt. Zu beachten ist, daß dx und dy positive und negative Werte haben. Die erste Bewegung verläuft von der Mitte nach oben rechts.
Ein blau gerandeter Testkreis hat immer den roten Vergleichskreis zu verdecken. Falls etwas Rotes sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine negativen Werte für dx und dy, falsche Koordinateneinheiten
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0kofalsche Koordinateneinheiten
Opera10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für Attribut feOffset
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 3/3
Opera9tp1 0/3
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 2/3
Opera10.60/ 11.00/11.60/ 12,00 3/3
Gecko 2.0/ 8.0 0/3
Gecko 12.0/ 24.0/ 36.0/ 48.0 3/3

feGaussianBlur

feGaussianBlur erlaubt eine Faltung der Quelle mit einer Gaußfunktion. Das Attribut stdDeviation ist ein Parameter für die Standardabweichung der Gaußfunktion. Wenn es nur einen wert hat, gilt dieser für x und y, bei zwei Werten gilt der erste für x, der zweite für y.

In der zweiten Ausgabe von SVG 1.1, im folgenden kurz SVG 1.1.2 genannt, im Gegensatz zu SVG 1.1.1 für die erste Ausgabe, gibt es eine sinnvolle, aber rückwärtsinkompatible Änderung des Verhaltens für Standardabweichung 0. Nach 1.1.1 soll in diesem nichts angezeigt werden, bei 1.1.2 das Original ohne Faltung, dies ist mathematisch ein korrektes Ergebnis (wie eine δ-Verteilung als Limes der Funktion).
Weil die Änderung inhaltlich sinnvoll ist, das zuvor definierte Verhalten aber nicht als falsch bewertet werden kann, wenn dies implementiert wurde, gibt es nur einen Hinweis, welche Variante implementiert wurde.
Weil das Verhalten nach 1.1.1 nicht besonders sinnvoll ist, aber implementiert sein kann, sollten Autoren die Standardabweichung 0 generell vermeiden und den gewünschten Effekt jeweils anders realisieren.

e2005-12-19-40: §Q
Animation des Attributes stdDeviation eines feGaussianBlur:
stdDeviation von feGaussianBlur in Einheiten von userSpaceOnUse wird nach 3s für 30s animiert und dann eingefroren. Die anfängliche Standardabweichung ist .04 .04. Die Werte sind: 0.2 0.1; 0.1 0.2; 0.05 0.07; 0.01 0.02; 0.003 0.00001; 0 0; 0 0; 0.01 0.02; 0.1 0.1; 0.3 0.2; 0.4 0.3; 1 2; 5 3. Die Breite der Graphik ist zum Vergleich 1.
Zusätzlich zeigt eine zentrierte schwarz gerandete Ellipse die stdDeviation eines Filters als halbe Hauptachsen. Eine große Ellipse entspricht einem weichen Filtereffekt zu einer Scharfen Form (ein gerandeter Kreis).

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobe(ok)Verhalten von SVG 1.1.2 (!)
Opera9tp1koFalls stdDeviation nicht klein im Vergleich mit Breite und Höhe ist, stürzt Opera ab.
Opera9.00/9.10koKeine Anzeige des animierten Filters.
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00(ok)Verhalten von SVG 1.1.1
Opera 11.60/ 12,00(ok)Verhalten von SVG 1.1.2
Gecko 2.0kokeine Animation
Gecko 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0(ok)Verhalten von SVG 1.1.2

e2009-07-12-01: §Q
Animation des Attributes stdDeviation eines feGaussianBlur:
stdDeviation von feGaussianBlur in Einheiten der objectBoundingBox wird nach 3s für 30s animiert und dann eingefroren. Die anfängliche Standardabweichung ist .04 .04. Die Werte sind: 0.2 0.1; 0.1 0.2; 0.05 0.07; 0.01 0.02; 0.003 0.00001; 0 0; 0 0; 0.01 0.02; 0.1 0.1; 0.3 0.2; 0.4 0.3; 1 2; 5 3. Die Breite der Graphik ist zum Vergleich 1.
Zusätzlich zeigt eine zentrierte schwarz gerandete Ellipse die stdDeviation eines Filters als halbe Hauptachsen. Eine große Ellipse entspricht einem weichen Filtereffekt zu einer scharfen Form (ein gerandeter Kreis).

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobe(ok)Verhalten von SVG 1.1.2 (!)
Opera9tp1kofalsche Einheiten; falls stdDeviation nicht klein im Vergleich mit Breite und Höhe ist, stürzt es ab.
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0kofalsche Einheiten
Opera9.00/9.10koKeine Anzeige des animierten Filters.
Opera10.60/ 11.00(ok)Verhalten von SVG 1.1.1
Opera 11.60/ 12,00(ok)Verhalten von SVG 1.1.2
Gecko 2.0kokeine Animation
Gecko 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0(ok)Verhalten von SVG 1.1.2

e2009-07-12-02: §Q
Animation des Attributes stdDeviation eines feGaussianBlur:
stdDeviation von feGaussianBlur in Einheiten von userSpaceOnUse wird nach 3s für 30s animiert und dann eingefroren.
Zum Vergleich zeigt eine zentrierte schwarz gerandete Ellipse grob die Größe der gefilterten Form. Der Haupteil der gefilterten Form muß innerhalb der zwei Ellipsen sein.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1koFalls stdDeviation nicht klein im Vergleich mit Breite und Höhe ist, stürzt Opera ab.
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Opera9.00/9.10koJeder zweite Wert wird nicht angezeigt.
Gecko 2.0kokeine Animation
Gecko 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2009-07-12-03: §Q
Animation des Attributes stdDeviation eines feGaussianBlur:
stdDeviation von feGaussianBlur in Einheiten der objectBoundingBox wird nach 3s für 30s animiert und dann eingefroren.
Zum Vergleich zeigt eine zentrierte schwarz gerandete Ellipse grob die Größe der gefilterten Form. Der Haupteil der gefilterten Form muß innerhalb der zwei Ellipsen sein.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoAdobe zeigt gar kein gefiltertes Objekt an.
Opera9tp1kofalsche Einheiten; falls stdDeviation nicht klein im Vergleich mit Breite und Höhe ist, stürzt Opera ab.
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0kofalsche Einheiten
Opera9.00/9.10kofalsche Einheiten; jeder zweite Wert wird nicht angezeigt.
Opera10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0kokeine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2010-08-26-01: §Q
Animation des Attributes stdDeviation eines feGaussianBlur:
stdDeviation von feGaussianBlur in lokalen Einheiten wird nach 3s für 30s animiert und dann eingefroren. Entweder ist die Standardabweichung in x oder y 0 und die andere nicht.
Zum Vergleich zeigt eine zentrierte schwarz gerandete Ellipse grob die Größe der gefilterten Form. Der Haupteil der gefilterten Form muß innerhalb der zwei Ellipsen sein.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoFilterregion nicht angezeigt
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0koFilterregion nicht angezeigt
Opera10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0kokeine Animation
Gecko 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für Attribut feGaussianBlur
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 3/5
Opera9tp1 0/5
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 1/5
Opera10.60/ 11.00/11.60/ 12,00 5/5
Gecko 2.0/ 8.0 0/5
Gecko 12.0/ 24.0/ 36.0 4/5
Gecko 48.0 5/5

feImage

feImage referenziert eine andere Graphik oder ein anderes Bild, dazu wird das Attribut xlink:href benutzt. Die Graphik kann ein komplettes Bild sein (PNG, SVG or JPEG) oder ein anderes darstellbares Element, welches sich außerhalb des Filters befinden kann. Im ersten Falle ist das Verhalten wie beim Element image, sonst wie beim Element use. Das Attribut preserveAspectRatio kann auch genutzt werden. Natürlich sollten aus Gründen der besseren Zugänglichkeit image und use bevorzugt werden, sofern möglich. Dieses Element ist hauptsächlich dann hilfreich, wenn die referenzierte Graphik selbst Teil des Filters ist wie andere interne Quellen wie sourceAlpha oder das Ergebnis eines anderen Urfilters.

e2005-12-19-50: §Q
Animation des Attributes xlink:href eines feImage:
xlink:href von feImage wird nach 5s für 5s von einer PNG mit einem roten Kreis zu einer PNG mit gelbem Kreis gewechselt. Beide Bilder haben einen blauen Hintergrund. Ein zusätzlicher feGaussianBlur wird angewendet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-19-51: §Q
Animation des Attributes xlink:href eines feImage:
xlink:href von feImage wird nach 5s für 5s von einem grünen Rechteck zu einer roten Ellipse mit blauen Rand gewechselt. Ein zusätzlicher feGaussianBlur wird angewendet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Anzeige

e2005-12-19-52: §Q
animierte Gruppe als Quelle eines feImage:
Quelle von feImage ist eine Gruppe mit einem Rechteck und einer Ellipse mit mehreren Animationen. Ein zusätzlicher feGaussianBlur wird angewendet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Anzeige

e2005-12-19-53: §Q
Animation des Attributes xlink:href eines feImage:
xlink:href von feImage wird nach 5s für 5s von einem einfachen eingebetteten cyanen PNG zu einem einfachen eingebetteten roten PNG gewechselt. Ein zusätzlicher feGaussianBlur wird angewendet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekokeine Anzeige
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2010-08-27-01: §P
Animation der Attribute x und y eines feImage:
x und y von feImage eines PNG werden nach 2s für 5s animiert. Ein rotes Rechteck dahinter hat die gleiche Animation. Falls es sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/tp2/ beta1/2/ 9.00/9.10koFilterbereich nicht angezeigt
Operax9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2010-08-27-02: §P
Animation der Attribute width und height eines feImage:
width und height von feImage eines PNG werden nach 2s für 5s animiert. Ein rotes Rechteck dahinter hat die gleiche Animation. Falls es sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/tp2/ beta1/2/ 9.00/9.10koFilterbereich nicht angezeigt
Operax9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für Attribut feImage
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 5/6
Opera9tp1 1/6
Opera9tp2/ beta1/2/ 9.00/9.10 4/6
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 6/6
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 4/6

feTile

feTile erlaubt die Anwendung von Mustern mit Filtern. in oder der vorherige Filter ergibt die Quelle.

e2005-12-19-60: §P
Animation des feTile:
feTile hat keine Attribute, die spezifisch für dieses Element sind.
Die allgemeinen Attribute x, y, width und height für alle Urfilter werden bei feTile animiert. Mehrere Werte für alle Attribute werden angewendet und die Animationen werden wiederholt.
Ein schwarz gerandetes Rechteck zeigt Position und Größe von feTile an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00kokleine vertikale Lücke in der Füllung
Gecko 2.0/ 8.0/ 12.0/ 48.0ok-
Gecko 24.0/ 36.0kofalscher Ausschnitt

e2005-12-19-61: §Q
feTile referenziert eine animierte Gruppe:
feTile referenziert ein feImage, welches eine animierte Gruppe referenziert, die aus einem grünen Quadrat und einer roten Ellipse mit blauem Rand. Beide werden rotiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2009-07-13-01: §P
Animation des feTile:
feTile hat keine Attribute, die spezifisch für dieses Element sind.
Die allgemeinen Attribute x, y, width und height für alle Urfilter werden bei feTile in objectBoundingBox Einheiten animiert. Mehrere Werte für alle Attribute werden angewendet und die Animationen werden wiederholt.
Ein schwarz gerandetes Rechteck zeigt Position und Größe von feTile an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekofeTile nicht angezeigt
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0kohorizontale Lücken im Muster
Gecko 24.0koseltsame Überreste und horizontale Lücken im Muster
Gecko 36.0/ 48.0ok-
Testergebnisse für Attribut feTile
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 2/3
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 2/3
Gecko 2.0/ 8.0/ 12.0 1/3
Gecko 24.0 0/3
Gecko 36.0 1/3
Gecko 48.0 2/3

feFlood

feFlood füllt eine Filterregion mit Farb- und Opazitätswerten durch die Eigenschaften flood-color und flood-opacity.

e2005-12-19-70: §Q
Animation der Eigenschaften flood-color und flood-opacity eines feFlood:
flood-color und flood-opacity von feFlood werden mit verschiedenen Werten animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-19-71: §Q
Animation der Eigenschaften flood-color mit animateColor und flood-opacity eines feFlood :
flood-color mit animateColor und flood-opacity von feFlood werden mit verschiedenen Werten animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2ko keine Animation von flood-color mit animateColor
Opera9 beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ko keine Animation von flood-color mit animateColor

e2005-12-19-72: §Q
diskrete Animation der Eigenschaft flood-color eines feFlood:
flood-color von feFlood wird mit verschiedenen Werten diskret animiert, einschließlich currentColor, begonnen wird mit rot als currentColor, welches jedes zweite Mal genommen wird, die anderen Farben sind blau, gelb und grün.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekokein currentColor
Opera9tp1kokein currentColor, ignoriert letzten Wert grün
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ko kein currentColor

e2010-08-28-01: §P
Animation der Attribute x und y von feFlood:
x und y von feFlood werden animiert. Ein rotes Rechteck dahinter hat die gleiche Animation. Falls es sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2010-08-28-02: §P
Animation der Attribute width und height von feFlood:
width und height von feFlood werden animiert. Ein rotes Rechteck dahinter hat die gleiche Animation. Falls es sichtbar wird, ist ein Fehler aufgetreten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für Attribut feFlood
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 4/5
Opera9tp1 3/5
Opera9tp2 4/5
Opera9beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 5/5
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 3/5

feBlend

feBlend blendet zwei Objekte zusammen, spezifizierte Modi verwendend.

e2005-12-20-01: §Q
Animation der Attribute in und in2 eines feBlend:
in und in2 von feBlend werden nach 5s für 5s ausgetauscht. Der sichtbare Effekt besteht darin, daß zwei referenzierte Bilder ihre Zeichenreihenfolge tauschen.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoOpazität der Bilder falsch
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-20-02: §Q
Animation des Attributes mode eines feBlend:
mode von feBlend wird alle 3s auf einen neuen Wert gesetzt, verwendet werden multiply, normal, screen, darken, lighten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoOpazität der Bilder falsch
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2010-08-29-01: §P
feBlend mit animierten Eingaben:
feBlend mit Modus normal wird auf Rechtecke mit animierter Füllung angewendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2kofalsche Interpolation
Opera9beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2010-08-29-02: §P
feBlend mit animierten Eingaben:
feBlend mit Modus multiply wird auf Rechtecke mit animierter Füllung angewendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10koMitte unten falsch
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2010-08-29-03: §P
feBlend mit animierten Eingaben:
feBlend mit Modus screen wird auf Rechtecke mit animierter Füllung angewendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10koMitte unten falsch
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2010-08-29-04: §P
feBlend mit animierten Eingaben:
feBlend mit Modus darken wird auf Rechtecke mit animierter Füllung angewendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10koMitte unten falsch
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2010-08-29-05: §P
feBlend mit animierten Eingaben:
feBlend mit Modus lighten wird auf Rechtecke mit animierter Füllung angewendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10koMitte unten falsch
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0ok-
Opera10.60/ 11.00/11.60/ 12,00korechts falsch
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt

e2010-08-30-01: §P
feBlend mit animiertem mode:
mode von feBlend wird alle 3s auf einen anderen Wert gesetzt, dabei werden normal, multiply, screen, darken, lighten verwendet.
Die Bereiche, welches als sichtbare Eingaben für feBlend verwendet werden, sind gestrichelt gekennzeichnet. An einigen Stellen gibt es zusätzliche Rechtecke teilweise außerhalb ohne Filter, aber mit der gleichen Farbe zum Vergleich. Falls sie sich vom gefilterten Bereich unterscheiden, zeigt dies einen Fehler an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10koMitte unten falsch
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0ok-
Opera10.60/ 11.00/11.60/ 12,00korechts falsch
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFilterbereich nicht angezeigt
Testergebnisse für Attribut feBlend
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 6/8
Opera9tp1 1/8
Opera9tp2 2/8
Opera9beta1/2/ 9.00/9.10 3/8
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/10.60 8/8
Opera11.00/11.60/ 12,00 6/8
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 2/8

feMerge

Mit feMerge können verschiedene Urfilter mit einem anderen Filter kombiniert werden.

e2005-12-20-10: §Q
Animation der feMerge, feMergeNodes:
feMerge hat keine Attribute, die spezifisch für dieses Element sind.
Zwei feMergeNodes werden ausgetauscht, eines nach 3s für 9s, ein anderer nach 6s für 3s. Als Eingabe werden feGaussianBlur, feOffset und feFlood genutzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10kokein SourceAlpha
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kokeine Animation
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

feSpecularLighting

Mit feSpecularLighting können Glanzlichter nach dem Phong-Beleuchtungsmodell auf die Quelle gesetzt werden, den alpha-Kanal als Eingabe nutzend. feDiffuseLighting und feSpecularLighting können in einem weiteren Schritt kombiniert werden.
Das Phong-Beleuchtungsmodell ist ein einfaches, nicht realistisches Modell, um Oberflächen- und Beleuchtungseffekte zu simulieren. Autoren und Nutzer sollten nicht zu viel erwarten...

e2005-12-20-21: §Q
Animation des surfaceScale von feSpecularLighting:
surfaceScale von feSpecularLighting wird innerhalb 30s von klein zu groß mit einem gelb-weißen fePointLight von der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10kogrößere Unterschiede, weil Farbinterpolation falsch ist
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalsche Position der Lichtquelle, falscher Effekt
Gecko 12.0/ 24.0/ 36.0/ 48.0kofalscher Effekt

e2005-12-20-22: §Q
Animation des specularConstant von feSpecularLighting:
specularConstant von feSpecularLighting wird innerhalb von 30s mit folgenden Werten animiert: 0.01;0.1;1;10;100;1000. Eine gelb-weiße fePointLight ist in der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10kogrößere Unterschiede, weil Farbinterpolation falsch ist
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0kofalscher Effekt

e2005-12-20-23: §Q
Animation des specularExponent von feSpecularLighting:
specularExponent von feSpecularLighting wird innerhalb von 30s mit folgenden Werten animiert: 1;2;4;8;16;32;64;128. Eine gelb-weiße fePointLight ist in der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10kogrößere Unterschiede, weil Farbinterpolation falsch ist
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0kofalscher Effekt

e2005-12-20-24: §Q
Animation des lighting-color von feSpecularLighting:
lighting-color von feSpecularLighting wird innerhalb von 30s mit folgenden Werten animiert: #ff0;#0ff;#f0f;#f00;#0f0;#00f;#ff0. Eine gelb-weiße fePointLight ist in der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0kofalscher Effekt

e2005-12-20-25: §Q
Animation der lighting-color von feSpecularLighting mit animateColor:
lighting-color von feSpecularLighting wird innerhalb von 30s mit den Werten #ff0;#0ff;#f0f;#f00;#0f0;#00f;#ff0 und mit einem fePointLight von der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet mit animateColor.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2kokein animateColor
Opera9 beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokein animateColor

e2005-12-20-26: §Q
diskrete Animation des lighting-color von feSpecularLighting:
lighting-color von feSpecularLighting wird innerhalb 30s mit den Werten currentColor;blue;currentColor;yellow;currentColor;green und mit fePointLight von der Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet diskret animiert. color ist rot.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekocurrentColor ignoriert
Opera9tp1kocurrentColor ignoriert, letzter grüner Wert ignoriert
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kocurrentColor ignoriert, falscher Ausschnitt
Gecko 48.0kocurrentColor ignoriert

e2009-07-15-01: §Q
Animation von kernelUnitLength von feSpecularLighting:
kernelUnitLength von feSpecularLighting wird innerhalb von 60s von klein zu groß animiert.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.
Ein Rechteck oben links zeigt die aktuelle kernelUnitLength.

Test results
user-agentresultcomment
W3C-ValidatorokSVG 1.1
AdobekoAttribute ignoriert, keine Animation
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00koLichtquelle falsch positioniert
Gecko 2.0kokeine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0kofalscher Effekt
Testergebnisse für feSpecularLighting
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 5/7
Opera9tp1 1/7
Opera9tp2 2/7
Opera9 beta1/2/ 9.00/9.10 3/7
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 6/7
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 0/7

feDiffuseLighting

Mit feDiffuseLighting kann diffuse Reflektion nach dem Phong-Beleuchtungsmodell auf die Quelle gesetzt werden, den alpha-Kanal als Eingabe nutzend. feDiffuseLighting und feSpecularLighting können in einem weiteren Schritt kombiniert werden. Das Phong-Beleuchtungsmodell ist ein einfache, nicht realistisches Modell, um Oberflächen- und Beleuchtungseffekte zu simulieren. Autoren und Nutzer sollten nicht zuviel erwarten...

e2005-12-20-30: §Q
Animation des surfaceScale von feDiffuseLighting:
surfaceScale von feDiffuseLighting wird innerhalb von 30s von klein zu groß animiert (verglichen mit z eines fePointLight Mitte rechts mit einem schwarz gerandeten Kreis gekennzeichnet diskret animiert).

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-31: §Q
Animation des diffuseConstant von feDiffuseLighting:
diffuseConstant von feDiffuseLighting wird innerhalb von 30s von klein zu groß animiert.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-32: §Q
Animation des kernelUnitLength von feDiffuseLighting:
kernelUnitLength von feDiffuseLighting wird innerhalb von 30s von klein zu groß animiert.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.
Ein Rechteck oben links zeigt die aktuelle kernelUnitLength.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoAttribut ignoriert, keine Animation
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ko Position der Lichtquelle falsch
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0kofalscher Effekt

e2005-12-20-33: §Q
Animation des lighting-color von feDiffuseLighting:
lighting-color von feDiffuseLighting wird innerhalb von 30s animiert.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-34: §Q
animateColor-Animation von lighting-color von feDiffuseLighting:
lighting-color von feDiffuseLighting wird innerhalb von 30s mit animateColor animiert.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2kokein animateColor
Opera9 beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt, kein animateColor
Gecko 48.0kokein animateColor

e2005-12-20-35: §Q
diskrete Animation von lighting-color von feDiffuseLighting:
lighting-color von feDiffuseLighting wird innerhalb von 30s diskrete animiert, wobei folgende Werte genutzt werden: currentColor;blue;currentColor;yellow;currentColor;green.
fePointLight ist mit einem schwarz gerandeten Kreis gekennzeichnet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekocurrentColor ignoriert
Opera9tp1kocurrentColor ignoriert, letzter grüner Wert ignoriert
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt, kein currentColor
Gecko 48.0kokein currentColor
Testergebnisse für feDiffuseLighting
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 4/6
Opera9tp1 3/6
Opera9tp2 4/6
Opera9 beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 5/6
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 0/6
Gecko 48.0 3/6

fePointLight

fePointLight wird zur Definition einer Punktlichtquelle für feDiffuseLighting von feSpecularLighting genutzt.

e2005-12-20-40: §Q
Animation der x und y von fePointLight in feDiffuseLighting:
x und y von fePointLight in feDiffuseLighting werden mit mehreren Werten und Wiederholung animiert.
Ein kleiner schwarzer Kreis zeigt die Position von fePointLight an.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60kofalsche Interpretation der Attribute in Korrelation mit kernelUnitLength
Opera11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-41: §Q
Animation des z von fePointLight in feDiffuseLighting:
z von fePointLight in feDiffuseLighting wird mit mehreren Werten und Wiederholung animiert.
Ein weiß gerandeter Kreis zeigt das Zentrum von fePointLight an und mit dem Durchmesser grob die Änderung der Erscheinung eines konstanten Raumwinkels mit Licht.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00kofalsche Interpretation der Attribute in Korrelation mit kernelUnitLength
Opera11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-42: §Q
Animation der x, y und z von fePointLight in feDiffuseLighting:
x, y und z von fePointLight in feDiffuseLighting werden mit mehreren Werten und Wiederholung animiert.
Ein weiß gerandeter Kreis zeigt das Zentrum von fePointLight an und mit dem Durchmesser grob die Änderung der Erscheinung eines konstanten Raumwinkels mit Licht.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kox und y (und z?) werden auf das Anzeigefenster bezogen und nicht auf das durch viewBox gegebene Koordinatensystem (oder im Allgemeinen auf das korrekte Koordinatensystem)
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2009-07-14-01: §Q
Animation der x, y und z von fePointLight in feDiffuseLighting:
x, y und z von fePointLight in feDiffuseLighting mit primitiveUnits objectBoundingBox werden mit mehreren Werten und Wiederholung animiert.
Ein weiß gerandeter Kreis zeigt das Zentrum von fePointLight an und mit dem Durchmesser grob die Änderung der Erscheinung eines konstanten Raumwinkels mit Licht.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekofalsche primitive Einheiten
Opera9tp1kox und y (und z?) werden auf das Anzeigefenster bezogen und nicht auf das durch viewBox gegebene Koordinatensystem (oder im Allgemeinen auf das korrekte Koordinatensystem); falsche primitive Einheiten
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ko falsche primitive Einheiten
Gecko 2.0/ 8.0ok-
Gecko 12.0/ 24.0/ 36.0/ 48.0kofalsche Animation
Testergebnisse für fePointLight
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 3/4
Opera9tp1 0/4
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60 1/4
Opera11.00/11.60/ 12,00 3/4
Gecko 2.0/ 8.0 1/4
Gecko 12.0/ 24.0/ 36.0 0/4
Gecko 48.0 2/4

feDistantLight

feDistantLight wird zur Definition einer unendlich weit entfernten Lichtquelle in feDiffuseLighting oder feSpecularLighting genutzt.

e2005-12-20-50: §Q
Animation der azimuth und elevation von feDistantLight in feDiffuseLighting:
azimuth und elevation von feDistantLight in feDiffuseLighting werden animiert. azimuth wird einmal in 30s mit Wiederholung rotiert. elevation wird nach 30s von 0 auf 45 gesetzt.
Eine weiße Linie zeigt die Richtung zur Lichtquelle einschließlich einer einfachen Projektion auf die Zeichenebene.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-51: §Q
Animation der azimuth und elevation von feDistantLight in feDiffuseLighting:
azimuth und elevation von feDistantLight in feDiffuseLighting werden animiert. elevation wird mit Wiederholung in 30s rotiert. azimuth wird nach 30s von 0 auf 45 gesetzt.
Eine Linie zeigt die Richtung zur Lichtquelle einschließlich einer einfachen Projektion auf die Zeichenebene. Ist die Lichtquelle vor dem Objekt, ist die Linie weiß, dahinter dunkelblau.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-
Testergebnisse für feDistantLight
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 2/2
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 2/2
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 0/2
Gecko 48.0 2/2

feSpotLight

feSpotLight wird zur Definition eines Scheinwerfers für feDiffuseLighting oder feSpecularLighting genutzt.

e2005-12-20-60: §Q
Animation der x und y von feSpotLight in feDiffuseLighting:
x und y von feSpotLight in feDiffuseLighting werden mit verschiedenen Werten und Wiederholung animiert.
Eine weiße Linie kennzeichnet die Richtung des Lichtes von der Lichtquelle.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-61: §Q
Animation des z von feSpotLight in feDiffuseLighting:
z von feSpotLight in feDiffuseLighting wird mit mehreren Werten und mit Wiederholung animiert.
Eine weiße Linie kennzeichnet die Richtung des Lichtes von der Lichtquelle. Der Anstieg der Linienbreite ist proportional zu z.
Das in SVG genutzte Phong-Modell steht im Widerspruch zur Energieerhaltung Das wird klar sichtbar, wenn Darstellungen mit großen und kleinen z verglichen werden - wenn die Lichtquelle nahe an einem Objekt ist, sollte die Oberfläche sehr hell sein, verglichen mit der gleichen Quelle bei großer Distanz. Autoren sollten dies erkennen, wenn sie Lichtquellen animieren. Für große Distanzen muß lighting-color entsprechend der Energieerhaltung manuell abgedunkelt werden (die gleiche Energie für den gleichen Raumwinkel und die gleiche Lichtquelle).

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-62: §Q
Animation der pointsAtX und pointsAtY von feSpotLight in feDiffuseLighting:
pointsAtX und pointsAtY von feSpotLight in feDiffuseLighting werden mit verschiedenen Werten und mit Wiederholung animiert.
Eine weiße Linie kennzeichnet die Richtung des Lichtes von der Lichtquelle.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-63: §Q
Animation des pointsAtZ von feSpotLight in feDiffuseLighting:
pointsAtZ von feSpotLight in feDiffuseLighting werden mit verschiedenen Werten und Wiederholung animiert.
Eine weiße Linie kennzeichnet die Richtung des Lichtes von der Lichtquelle. Der Anstieg der Linienbreite ist proportional zu z.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-64: §Q
Animation des limitingConeAngle von feSpotLight in feDiffuseLighting:
limitingConeAngle von feSpotLight in feDiffuseLighting wird mit verschiedenen Werten und Wiederholung animiert.
Drei weiß gerandete Kreise kennzeichnien den begrenzenden Konus, einen auf dem Kreis, einen in der Mitte für das Quadrat und einen bei Höhe null. Es darf kein Licht jenseits dieser Kreise innerhalb der entsprechenden Form geben.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00koleicht falscher limitingConeAngle
Gecko 2.0/ 8.0kofalscher Ausschnitt, falscher limitingConeAngle
Gecko 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-20-65: §Q
Animation des specularExponent von feSpotLight in feDiffuseLighting:
specularExponent von feSpotLight in feDiffuseLighting wird mit verschiedenen Werten und Wiederholung animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-
Testergebnisse für feSpotLight
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 6/6
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 5/6
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 0/6
Gecko 48.0 6/6

feTurbulence

feTurbulence erzeugt eine Struktur mit Pseudozufallsturbulenz oder fraktales Rauschen, wobei diePerlin-Turbulenzfunktion benutzt wird.

e2005-12-21-01: §Q
Animation des seed von feTurbulence:
seed von feTurbulence wird alle 5s geändert, was zufällig erzeugte Bilder bewirkt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekoeinige vertikale strichartige Störungen
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-02: §Q
Animation der numOctaves von feTurbulence:
numOctaves von feTurbulence wird in 45s animiert, was verschiedene Bilder erzeugt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekoeinige vertikale strichartige Störungen
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-03: §Q
Animation des stitchTiles von feTurbulence:
stitchTiles von feTurbulence nach 5s von noStitch zu stitch umgeschaltet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-04: §Q
Animation des baseFrequency von feTurbulence:
baseFrequency von feTurbulence wird in 90s animiert, was verschiedene Bilder erzeugt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekoeinige vertikale strichartige Störungen
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Opera9.00/9.10kokeine horizontale Turbulenz in 9.00, keine Anzeige in 9.10
Gecko 2.0kokeine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-05: §Q
Animation des type von feTurbulence:
type von feTurbulence wird nach 5s von turbulence zu fractalNoise umgeschaltet.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekoeinige vertikale strichartige Störungen
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-06: §Q
Animation verschiedener Attribute von feTurbulence:
Verschiedene Attribute von feTurbulence werden mit Wiederholung animiert, woraus sich verschiedene Bilder ergeben.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekoeinige vertikale strichartige Störungen
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Opera9.00/9.10kokeine horizontale Turbulenz in 9.00, konstante graue Anzeige in 9.10
Gecko 2.0kokeine Animation von baseFrequency
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für feTurbulence
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 1/6
Opera9tp1 5/6
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 6/6
Opera9.00/9.10 4/6
Gecko 2.0 4/6
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0 6/6

feComposite

feComposite kombiniert zwei Quellen. Das Ergebnis hängt vom benutzten Operator ab.

e2005-12-21-20: §Q
Animation der in und in2 von feComposite:
in und in2 von feComposite werden nach 5s für 5s ausgetauscht. Weil operator over ist, ist der sichtbare Effekt, daß sich die Zeichenreihenfolge für 5s umkehrt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoOpazität von Bildern ist falsch
Opera9tp1kokeine Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-21: §Q
Animation des operator von feComposite:
operator von feComposite wird alle 3s ausgetauscht, zuerst over, dann in, out, atop, xor.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoOpazität von Bildern falsch, Interpretation des Attributes falsch, siehe auch das Beispiel aus der Spezifikation für feComposite ohne Animation.
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00okDas Beispiel aus der Spezifikation für feComposite ohne Animation ist in Opera9tp1 nicht komplett richtig.
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-21-22: §Q
Animation der k1, k2, k3, k4 von feComposite:
k1, k2, k3, k4 von feComposite werden alle 3s lang von 0 nach 1 animiert, Die Animationen starten nacheinander, die erste nach 3s, der Anfangswert für alle ist 0.5. Nach 15s und 18s werden einige Überblendeffekt ausprobiert k2 ein, k3 aus mit k1 und k4 zero oder k1 ein, k4 aus, k2 und k3 null.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoInterpretation des Attributes falsch, siehe auch das Beispiel aus der Spezifikation für feComposite ohne Animation.
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00okDas Beispiel aus der Spezifikation für feComposite ohne Animation ist in Opera9tp1 nicht komplett richtig.
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für feComposite
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 0/3
Opera9tp1 2/3
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 3/3
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 3/3

feColorMatrix

Eine Matrixtransformation im Farb- und alpha-Raum kann mit feColorMatrix durchgeführt werden.

e2005-12-22-01: §Q
Animation des Attributes values für feColorMatrix:
values für feColorMatrix mit type saturate wird in 10s von 0 nach 1 animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok*
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok*
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok*

* Kleinere Unterschiede...

e2005-12-22-02: §Q
Animation des Attributes values für feColorMatrix:
values für feColorMatrix mit type hueRotate wird in 10s von 0 nach 360 animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok*
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok*
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok*

* Kleinere Differenzen...

e2005-12-22-03: §Q
Animation der Attribute type und values für feColorMatrix:
type und values für feColorMatrix werden animiert. Die ersten 10s ist type hueRotate und values wird innerhalb von 10s von 0 nach 360 animiert. Die nächsten 10s ist type saturate und values wird innerhalb von 10s von 0 auf 1 animiert. Dann wird type auf luminanceToAlpha gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok*
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok*
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok*

* Kleinere Unterschiede...

e2005-12-22-04: §Q
Animation des Attributes values für feColorMatrix mit type matrix:
values für feColorMatrix mit type matrix wird nach 3s für 30s mit verschiedenen Matrizen animiert. Letzter Wert ist eine komplett blaue Graphik.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1koblaues Ende ignoriert
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-
Testergebnisse für feColorMatrix
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 4/4
Opera9tp1 3/4
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 4/4
Gecko 2.0/ 8.0 0/4
Gecko 12.0/ 24.0/ 36.0 3/4
Gecko 48.0 4/4

feDisplacementMap

feDisplacementMap nutzt die Pixelfarbwerte des Bildes von 'in2', um die Pixel aus 'in' in x- oder y-Richtung zu verschieben.
Leider gibt die Spezifikation keinen Hinweis darauf, wozu das konkret gut sein, daher mögen die Beispiele nicht sehr nützlich sein. Es sollte möglich sein, eine einfache Oberflächenprojektion im x, y, z-Raum anzubieten, wobei z = Funktion von x und y, die x-y-Struktur in einer Graphik speichernd und die z-Information zusammen mit der Verschiebung in der anderen Graphik.

e2005-12-22-10: §Q
Animation von scale, xChannelSelector, yChannelSelector, in und in2 von feDisplacementMap:
scale, xChannelSelector, yChannelSelector, in und in2 von feDisplacementMap werden nach 3s mit mehreren Werten und Kombinationen ausgetauscht. Als Bilder werden zusätzliche interne SVGs genutzt, die Kreise mit unterschiedlichen Farben enthalten.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekofalsche Positionierung der internen SVGs
Opera9tp1kofalsche Skalierung der Filterkoordinaten, keine Anzeige, aber korrekte Positionierung der internen SVGs
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ko keine Anzeige
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Anzeige

e2005-12-22-11: §Q
Animation von scale, xChannelSelector, yChannelSelector, in von feDisplacementMap,
Animation von scale, xChannelSelector, yChannelSelector, in von feDisplacementMap, wobei die Bilder mit feTurbulence erzeugt werden:
scale, xChannelSelector, yChannelSelector, in von feDisplacementMap werden nach 3s mit mehreren Werten und Kombinationen ausgetauscht.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekofalsche Interpretation eines PNGs, falsche Interpretation negativer Werte für scale?
Opera9tp1kofalsche Animation
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-22-12: §Q
feDisplacementMap und feComposite mit animierter Quelle
In feDisplacementMap wird eine animierte Ellipse gemutzt, um das Portrait des Autors zu verschieben. Die Ellipse wird rotiert und die Farbe wird animiert, woraus sich eine sich ändernde Verschiebung ergibt in der Form einer Ellipse. Mit feComposite wird der sichtbare Bereich auf die animierte Ellipse reduziert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Anzeige

e2009-07-22-01: §Q
feDisplacementMap kombiniert mit animiertem Gradienten
Eine feDisplacementMap mit einem radialen Gradienten wird verwendet, um ein blaues Kreuz zu verschieben.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine Anzeige
Testergebnisse für feDisplacementMap
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 2/4
Opera9tp1 2/4
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 3/4
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0 1/4

feComponentTransfer

Mit feComponentTransfer können einige Farbtransformationen mittels der zu umschließenden Elemente feFuncR, feFuncG, feFuncB, feFuncA vorgenommen werden.

e2005-12-23-01: §Q
Animation des Attributes slope von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
slope von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type linear wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-23-02: §Q
Animation des Attributes intercept von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
intercept von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type linear wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-23-03: §Q
Animation des Attributes amplitude von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
amplitude von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type gamma wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoNegativer Exponent wird als positiver interpretiert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-23-04: §Q
Animation des Attributes exponent von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
exponent von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type gamma wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoNegativer Exponent wird als positiver interpretiert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-23-05: §Q
Animation des Attributes offset von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
offset von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type gamma wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoNegativer Exponent wird als positiver interpretiert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0kofalscher Ausschnitt
Gecko 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-23-06: §Q
Animation des Attributes tableValues von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
tableValues von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type table wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekofuncA ignoriert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-23-07: §Q
Animation des Attributes tableValues von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
tableValues von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer mit type discrete wird innerhalb von 10s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekofuncA ignoriert
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-

e2005-12-23-08: §Q
Animation des Attributes type von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
type von feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer wird nach 5s von linear auf identity gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0kofalscher Ausschnitt
Gecko 48.0ok-
Testergebnisse für feComponentTransfer
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 3/8
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 8/8
Gecko 2.0/ 8.0 0/8
Gecko 12.0/ 24.0/ 36.0 2/8
Gecko 48.0 8/8

feMorphology

An- und Abtragungen an einer Quelle können mit feMorphology erreicht werden.

e2005-12-23-20: §Q
Animation der Attribute operator und radius von feMorphology:
operator und radius von feMorphology werden animiert. Zuerst ist operator erode und radius wird in 10s von 1 1 zu 10 5 animiert. Dann wird operator auf dilate gesetzt und die Animation von radius wird wiederholt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Opera9.00/9.10kokeine Anzeige
Gecko 2.0/ 8.0kofalscher Ausschnitt, kein Text für erode
Gecko 12.0/ 24.0kokein Text für erode
Gecko 36.0/ 48.0ok -

feConvolveMatrix

feConvolveMatrix führt eine Matrixfaltung der Quelle als Filtereffekt aus.

e2005-12-24-01: §Q
Animation des Attributes divisor von feConvolveMatrix:
divisor von feConvolveMatrix wird nach 3s für 20s um die Voreinstellung animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-24-02: §Q
Animation des Attributes bias von feConvolveMatrix:
bias von feConvolveMatrix wird nach 3s für 20s um die Voreinstellung animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
AdobekoFalsche Anzeige für negativen bias, falsche Animation
Opera9tp1ok-
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00koFalsche Anzeige für negativen bias, falsche Animation
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0koFalsche Anzeige für negativen bias, falsche Animation

e2005-12-24-03: §Q
Animation des Attributes kernelUnitLength von feConvolveMatrix:
kernelUnitLength von feConvolveMatrix wird mit mehreren Werten nach 3s für 20s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0kokeine Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0ok-
Gecko 48.0kofalscher Effekt

e2005-12-24-04: §Q
Animation der Attribute targetX und targetY von feConvolveMatrix:
targetX und targetY von feConvolveMatrix werden nach 3s für 20s um die Voreinstellung animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-24-05: §Q
Animation des Attributes preserveAlpha von feConvolveMatrix:
preserveAlpha von feConvolveMatrix wird nach 3s für 10s von true auf false gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-24-06: §Q
Animation des Attributes edgeMode von feConvolveMatrix
e2011-08-11-01: §Q
Animation des Attributes edgeMode von feConvolveMatrix (2)
e2011-08-11-02: §Q
Animation des Attributes edgeMode von feConvolveMatrix (3)
edgeMode von feConvolveMatrix wird alle 5s von none zu wrap zu duplicate gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2koKeine Anzeige von wrap, sieht aber lustig aus
Opera9 beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0kounscharf
Gecko 36.0/ 48.0ok-

e2005-12-24-07: §Q
Animation des Attributes kernelMatrix von feConvolveMatrix:
kernelMatrix von feConvolveMatrix wird mit verschiedenen Werten nach 3s für 50s animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-

e2005-12-24-08: §Q
Animation des Attributes kernelMatrix von feConvolveMatrix:
kernelMatrix von feConvolveMatrix wird nach 3s für 20s von einer Matrix zur einer anderen animiert.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobekokeine lineare sondern diskrete Animation?
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00kokeine lineare sondern diskrete Animation?
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0kokeine lineare sondern diskrete Animation?

e2005-12-24-09: §Q
Animation der Attribute kernelMatrix und order von feConvolveMatrix:
kernelMatrix und order von feConvolveMatrix werden nach 3s für 10s auf einen anderen Wert gesetzt, dann nach weiteren 10s auf eine andere kernelMatrix und order und dann wieder zu anderen für 10s.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta1/2ko falsche Anzeige, order nicht animiert?
Opera9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0kokeine Anzeige für Animation
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0ok-
Testergebnisse für feConvolveMatrix
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 7/9
Opera9tp1 6/9
Opera9tp2 5/9
Opera9 beta1/2 6/9
Opera9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 7/9
Gecko 2.0 4/9
Gecko 8.0/ 12.0/ 24.0 6/9
Gecko 36.0 7/9
Gecko 48.0 6/9

Eigenschaft color-interpolation-filters

Ähnlich der color-interpolation für den allgemeinen Gebrauch bestimmt die Eigenschaft color-interpolation-filters den Farbraum für Filteroperationen.

e2005-12-25-01: §Q
Animation der Eigenschaft color-interpolation-filters:
color-interpolation-filters wird nach 5s für 5s von sRGB auf linearRGB gesetzt.

Testergebnisse
DarstellungsprogrammErgebnisKommentar
W3C-ValidatorokSVG 1.1
Adobeok-
Opera9tp1/2/ beta2/ 9.00/9.10kokeine Animation, Eigenschaft ignoriert
Opera9 beta1kostürzt unmittelbar ab
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00ok-
Gecko 2.0/ 8.0/ 24.0/ 36.0/ 48.0kokeine Animation, Eigenschaft ignoriert
Gecko 12.0ok-
Testergebnisse für Filtereffekte
DarstellungsprogrammSVG 1.1
DarstellungsprogrammSVG 1.1
Adobe 77/111
Squiggle 1.7 1/111
Opera9tp1 53/111
Opera9tp2 74/111
Opera9 beta1/2 79/111
Opera9.00/9.10 77/111
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 94/111
Opera10.60 97/111
Opera11.00/11.60/ 12,00 98/111
Gecko 2.0 28/111
Gecko 8.0 37/111
Gecko 12.0 55/111
Gecko 24.0 53/111
Gecko 36.0 56/111
Gecko 48.0 78/111