Amaya 9.51/11.3.1, KSVG 1, WebKit 528.16 and Opera 8.x ignore filter effects completely, therefore they are not mentioned. Squiggle 1.7 displays most filters, but does not animate it. Only one property is animated, this is mentioned as a test result, all others are failed.
Note, that most filter effects are just useful if combined with each other. The effect of several
single filter primitives can be realised easier with other elements and methods of svg, but the combination
of several filter primitives can cause interesting additional effects. Anyway some single filter primitives
can already cause interesting effects without a combination with other filters. Here the filter effects are
just tested, therefore most examples are simple without complex combinations of several filters. The
combination of filters might cause additional problems, not in the focus of these tests.
Often is is not easy to test a correct behaviour of a filter primitve quantitatively, therefore most
tests are just qualitatively. If differences between the presentation of different user agents occur,
this might be a hint of a quantitative error in one or both of them.
e2005-12-18-01: §P
set animation of the
filterUnits attribute:
filterUnits is animated from objectBoundingBox to userSpaceOnUse after 3s for 5s.
In this situation it means, the filter feGaussianBlur is first just applied to the circle in the
center of the svg and then it is expanded to the complete viewBox and after 5s back again to
the initial smaller sized structure.
A gray stroked square indicates the filter area.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no display for objectBoundingBox, change to userSpaceOnUse with the set animation works |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-18-02: §Q
set animation of the
primitiveUnits attribute:
primitiveUnits is animated from objectBoundingBox to userSpaceOnUse after 3s for 5s.
In this situation it means, the filter feGaussianBlur is first just applied to the circle in the
center of the svg and then it is expanded to the complete viewBox and after 5s back again to
the initial smaller sized structure.
The filter primitive subregion is indicated with a gray stroked square. Note, that the standard deviation of
the feGaussianBlur changes too with the animation.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | filter primitive subregion wrong |
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | fail | standard deviation of the feGaussianBlur unchanged |
Opera10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-18-03: §P
animation of the
x and y attributes:
x and y are animated within 5s and are frozen. They are changed from 0 to 0.5, this
means from top left to the center.
A gray stroked square indicates the filter area in userSpaceOnUse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no display |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-06-01: §P
animation of the
x and y attributes:
x and y are animated within 5s and are frozen. They are changed from 0 to 0.5, this
means from top left to the center.
A gray stroked square indicates the filter area in objectBoundingBox.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no display |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-18-04: §P
animation of the
width and height attributes:
width and height are animated within 5s and are frozen. They are changed from 0 to 1, this
means from no display to full display, expanding from top left.
A gray stroked square indicates the filter area in userSpaceOnUse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-07-01: §P
animation of the
width and height attributes:
width and height are animated within 5s and are frozen. They are changed from 0 to 1, this
means from no display to full display, expanding from top left.
A gray stroked square indicates the filter area in objectBoundingBox.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-18-05: §Q
animation of the
filterRes attribute:
filterRes animated within 30s and is frozen. It is changed with the values
1 5;10 500;100 50;400 200; 500 500, this means a change and finally a
refining of the filter resolution.
Note that at the first values resolution for x and y differ.
A black stroked rectangle top left with roughly the same width and height
as one filter dot is provided for comparison.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Opera9tp2/ beta1/2 | fail | attribute ignored |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 24.0/ 36.0 | fail | filter area wrong |
Gecko 12.0 | ok | - |
Gecko 48.0/ 60.0 | fail | attribute ignored |
e2009-07-11-01: §Q
animation of the
filterRes attribute:
filterRes animated discrete within 60s and is frozen. It is changed with the values
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.
The filter is applied to a chequered blue area with 16 squares.
This raster is indicated black stroked for comparison. For a filterRes of 4, 8 or 12 (etc)
the filtered pattern has to fit exactly into the raster, for other filterRes there have to
be artifacts from the non fitting resolution. Due to the symmetries of the chequer pattern
the filterRes 0.5, 1, 2, 2 4, 4 2 etc have to result in only one color (the same for all) for the
complete area.
Gray rectangles top left indicate the size of one filter unit corresponding to the filterRes.
Note, that the specification does not require positive integers as values, only numbers.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | the resulting colors look sometimes wrong, for example '2 4' and '4 2' should result in just one color for the complete area |
Opera9tp1/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | fail | the resulting colors look sometimes wrong, for example '2 4' and '4 2' should result in just one color for the complete area |
Opera9tp2/ beta1/2 | fail | attribute ignored |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | no animation |
Gecko 48.0/ 60.0 | fail | attribute ignored |
e2005-12-18-06: §M(1)P
animation of the
xlink:href attribute:
xlink:href is set to another filter source after 3s for 5s, resulting in
another offset in this time.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | attribute ignored |
Opera9tp1 | fail | attribute ignored |
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 | fail | minor offset error |
Gecko 2.0/ 8.0/ 12.0 | fail | attribute ignored |
Gecko 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 7/9 |
e2005-12-18-21: §M(1)P
animation of the
filter property:
The filter property is set to another filter source after 3s for 5s, resulting in
another offset in this time.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Squiggle 1.7 | ok | - |
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 | fail | minor offset error |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | strange clipping |
e2005-12-19-01: §P
animation of the
x and y attributes of a filter primitive:
x and y of feGaussianBlur are animated within 5s and are frozen.
They are changed from 0 to 0.5, this means from top left to the center.
A gray stroked square indicates the filter primitive subregion in userSpaceOnUse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0 | ok | - |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-08-01: §P
animation of the
x and y attributes of a filter primitive:
x and y of feGaussianBlur are animated within 5s and are frozen.
They are changed from 0 to 0.5, this means from top left to the center.
A gray stroked square indicates the filter primitive subregion in userSpaceOnUse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | attribute ignored |
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 | ok | - |
Gecko 2.0/ 8.0 | fail | minor rendering problems |
Gecko 12.0/ 48.0/ 60.0 | ok | - |
Gecko 24.0/ 36.0 | fail | wrong filter area |
e2005-12-19-02: §P
animation of the
width and height attributes of a filter primitive:
width and height of feGaussianBlur are animated within 5s and are frozen.
They are changed from 0 to 1, this
means from no display to full display, expanding from top left.
A gray stroked square indicates the filter primitive subregion in userSpaceOnUse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-09-01: §P
animation of the
width and height attributes of a filter primitive:
width and height of feGaussianBlur are animated within 5s and are frozen.
They are changed from 0 to 1, this
means from no display to full display, expanding from top left.
A gray stroked square indicates the filter primitive subregion in objectBoundingBox.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | attribute ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-10: §Q
animation of the
in attribute of a filter primitive:
in of feGaussianBlur is set after 5s from SourceGraphic to SourceAlpha for 5s.
This results in a change from a coloured graphic to a grayscale and back to colour.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-11: §Q
animation of the
in attribute of a filter primitive:
in of feGaussianBlur is changed in 12s using the values
SourceGraphic;SourceAlpha;FillPaint;StrokePaint.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0 | fail | partially missing filter sources |
Gecko 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-12: §Q
animation of the
in attribute of a filter primitive:
in of feGaussianBlur is set after 5s from BackgroundImage
to BackgroundAlpha for 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | Note, that the example in the specification for background image is incorrect presented in Adobe, but this simple example is correct, therefore Adobes behaviour is not really reliable for background image. |
Opera9tp1 | fail | no animation, but presentation of background image is correct. |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no animation |
e2005-12-19-13: §M(1)P
animation of the
in attribute of a filter primitive:
in of feOffset is changed between the 9 values
from several other feOffset elements with positive or negative shifts
for dx and dy.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0 | fail | minor rendering problems |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-20: §M(1)P
animation of the
result attribute of a filter primitive:
result of a feOffset is set after 5s for 5s to the name of
a previous feOffet result and therefore overrides it.
This is taken as the input for a feOffset with the
visible effect of a shift for this 5s.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0 | fail | minor rendering problems |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 8/9 |
feOffset moves the filtered object by dx and dy relative to the source.
e2005-12-19-30: §M(1)P
animation of the
dx and dy attributes of a feOffset:
dx and dy of a feOffset are changed between several values
with repetition, resulting in a moving object. Note that
dx and dy have positive and negative values. The first move
is from the center to top right.
Note that this example is just useful to test the attributes of this filter primitive,
to realise such motion either the cx and cy of the circle should be animated or
an animateTransform or animateMotion should be used directly for the element
or group without using a filter.
In the specification is mentioned, that it can especially used to generate a shifted
shadow - note that this is surely incorrect for a light source at finite distance. In
such a case a shadow is not just shifted, it is scaled too.
To get a better result and any shadow if user agents do not support filters, it might
be useful to realise the shadow using a transformed (and then filtered) use of the
original object.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no negative values for dx and 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,00 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-10-01: §M(1)P
animation of the
dx and dy attributes of a feOffset:
dx and dy of a feOffset with filterUnits and primitiveUnits userSpaceOnUse
are changed between several values
with repetition, resulting in a moving object. Note that
dx and dy have positive and negative values. The first move
is from the center to top right.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no negative values for dx and 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,00 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-10-02: §M(1)P
animation of the
dx and dy attributes of a feOffset:
dx and dy of a feOffset with filterUnits and primitiveUnits objectBoundingBox
are changed between several values
with repetition, resulting in a moving object. Note that
dx and dy have positive and negative values. The first move
is from the center to top right.
The blue stroked test circle has always to cover the red
comparison circle. If something red gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no negative values for dx and dy, wrong coordinate units |
Opera9tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | fail | wrong coordinate units |
Opera10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 3/3 |
feGaussianBlur allows a convolution of the source with a gaussian function. The attribute stdDeviation is a parameter for the standard deviation of the gaussian function. If it has only one value, this is for x and y, with two values the first one is for x, the second for y.
In the second edition of SVG 1.1, short SVG 1.1.2, in opposite to the first edition SVG 1.1.1
there is another useful, but backwards incompatible change of the behaviour for the
standard deviation 0. According to 1.1.1 nothing has to be displayed, according to
1.1.2 the original graphics has to be displayed without convolution. This is the
mathematically correct result (like a δ distribution as a limit of the function).
Because this change is useful, but the previously defined behaviour cannot be evaluated
as wrong, if this is implemented, there is only a hint, which variant is implemented.
Because the behaviour according to 1.1.1 is not very meaningful, but it can be implemented,
authors should avoid standard deviations of 0 in general and to realise the desired effect
in another way.
e2005-12-19-40: §Q
animation of the
stdDeviation attribute of a feGaussianBlur:
stdDeviation of feGaussianBlur in userSpaceOnUse units is animated after 3s for 30s and is frozen.
The initial stdDeviation is .04 .04. The values are:
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.
The width of the graphic is 1 for comparison.
Additionally there is a centered black stroked ellipse indicating the stdDeviation of the filter as main half axis.
A large sized ellipse corresponds to a smooth filter effect, a small ellipse corresponds to a sharp shape (a stroked
circle).
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | (ok) | Behaviour of SVG 1.1.2 (!) |
Opera9tp1 | fail | if the stdDeviation is not small compared to width and height, Opera crashes. |
Opera9.00/9.10 | fail | no display of animated filter |
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00 | (ok) | Behaviour of SVG 1.1.1 |
Opera 11.60/ 12,00 | (ok) | Behaviour of SVG 1.1.2 |
Gecko 2.0 | fail | no animation |
Gecko 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | (ok) | Behaviour of SVG 1.1.2 |
e2009-07-12-01: §Q
animation of the
stdDeviation attribute of a feGaussianBlur:
stdDeviation of feGaussianBlur in objectBoundingBox units is animated after 3s for 30s and is frozen.
The initial stdDeviation is .04 .04. The values are:
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.
The width of the graphic is 1 for comparison.
Additionally there is a centered black stroked ellipse indicating the stdDeviation of the filter as main half axis.
A large sized ellipse corresponds to a smooth filter effect, a small ellipse corresponds to a sharp shape (a stroked
circle).
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | (ok) | Behaviour of SVG 1.1.2 (!) |
Opera9tp1 | fail | wrong units; if the stdDeviation is not small compared to width and height, Opera crashes. |
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | fail | wrong units |
Opera9.00/9.10 | fail | no display of animated filter |
Opera10.60/ 11.00 | (ok) | Behaviour of SVG 1.1.1 |
Opera 11.60/ 12,00 | (ok) | Behaviour of SVG 1.1.2 |
Gecko 2.0 | fail | no animation |
Gecko 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | (ok) | Behaviour of SVG 1.1.2 |
e2009-07-12-02: §Q
animation of the
stdDeviation attribute of a feGaussianBlur:
stdDeviation of feGaussianBlur in userSpaceOnUse units is animated discrete after 3s for 30s and is frozen.
For comparison there are centered black stroked ellipses indicating roughly the size of the filtered shape.
The major part of the filtered shape has to be between the two ellipses.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | if the stdDeviation is not small compared to width and height, Opera crashes. |
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Opera9.00/9.10 | fail | every second value not displayed |
Gecko 2.0 | fail | no animation |
Gecko 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2009-07-12-03: §Q
animation of the
stdDeviation attribute of a feGaussianBlur:
stdDeviation of feGaussianBlur in objectBoundingBox units is animated discrete after 3s for 30s and is frozen.
For comparison there are centered black stroked ellipses indicating roughly the size of the filtered shape.
The major part of the filtered shape has to be between the two ellipses.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | Adobe does not show the filtered object at all. |
Opera9tp1 | fail | wrong units; if the stdDeviation is not small compared to width and height, Opera crashes. |
Opera9tp2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | fail | wrong units |
Opera9.00/9.10 | fail | wrong units; every second value not displayed |
Opera10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2010-08-26-01: §Q
animation of the
stdDeviation attribute of a feGaussianBlur:
stdDeviation of feGaussianBlur in userSpaceOnUse units is animated discrete after 3s for 30s and is frozen. Either the standard deviation in x or in y is zero and the other not.
For comparison there are centered black stroked ellipses indicating roughly the size of the filtered shape.
The major part of the filtered shape has to be between the two ellipses.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | filter area not displayed |
Opera9tp1/tp2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | fail | filter area not displayed |
Opera10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 1.1 |
Adobe | 1/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/ 60.0 | 5/5 |
feImage references another graphic or images, using the xlink:href attribute. The graphic can be a complete image (PNG, SVG or JPEG) or some element, which can be outside the filter. In the first case the behaviour is like that of the image element, else it is like the use element. The preserveAspectRatio attribute can be used too. Of course for acessibility image and use should be preferred, if possible. This element is mainly useful, if the referred graphic itself is part of the filter like internal sources like sourceAlpha or a result of another filter primitive.
e2005-12-19-50: §Q
animation of the
xlink:href attribute of a feImage:
xlink:href of feImage is set after 5s from a PNG with
a red circle to a PNG with a yellow circle for 5s. Both
images have a blue background.
An additional feGaussianBlur is applied.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-51: §Q
animation of the
xlink:href attribute of a feImage:
xlink:href of feImage is set after 5s from a green rectangle
to a red ellipse with blue stroke for 5s. An additional feGaussianBlur is applied.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no display |
e2005-12-19-52: §Q
animated group
as a source of a feImage:
Source of feImage is a group of a rect and an ellipse with several animations.
An additional feGaussianBlur is applied.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no display |
e2005-12-19-53: §Q
animation
of the xlink:href attribute of a feImage:
xlink:href of feImage is set after 5s from a simple
embedded cyan PNG
to simple embedded red PNG for 5s.
An additional feGaussianBlur is applied.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | no display |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2010-08-27-01: §P
animation
of the attributes x and y of a feImage:
x and y of feImage are animated after 2s from a PNG for 5s.
A red rectangle behind has the same animation.
It if gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/tp2/ beta1/2/ 9.00/9.10 | fail | filter area not displayed |
Operax9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2010-08-27-02: §P
animation
of the attributes width and height of a feImage:
width and height of feImage are animated after 2s from a PNG for 5s.
A red rectangle behind has the same animation.
It if gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/tp2/ beta1/2/ 9.00/9.10 | fail | filter area not displayed |
Operax9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 4/6 |
feTile allows pattern within filters. in or the previous filter primitive gives the source of the pattern.
e2005-12-19-60: §P
animation of the
feTile:
feTile has no attributes specific for this element.
Common attributes x, y, width and height for filter primitives
are animated with feTile. Several values for all attributes are
used with repetition.
A black stroked rectangle indicates the position and size of
the feTile.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | fail | small vertical gap within tile |
Gecko 2.0/ 8.0/ 12.0/ 48.0/ 60.0 | ok | - |
Gecko 24.0/ 36.0 | fail | wrong filter area |
e2005-12-19-61: §Q
feTile refers an animated group:
feTile references a feImage which refers to an animated
group constiting of a green square and a red ellipse with
a blue stroke. Both are rotated.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2009-07-13-01: §P
animation of the
feTile:
feTile has no attributes specific for this element.
Common attributes x, y, width and height for filter primitives
are animated with feTile in objectBoundingBox units.
Several values for all attributes are used with repetition.
A black stroked rectangle indicates the position and size of
the feTile.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | feTile not displayed |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0 | fail | horizontal gaps in tile |
Gecko 24.0 | fail | strange residuals and horizontal gaps in tile |
Gecko 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 2/3 |
feFlood fills the filter region with the color and opacity values from properties flood-color and flood-opacity.
e2005-12-19-70: §Q
animation of the
flood-color and flood-opacity properties of a feFlood:
flood-color and flood-opacity of feFlood are animated
with several values.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-19-71: §Q
animateColor animation of the
flood-color and animate animation of the flood-opacity properties of a feFlood:
flood-color is animated with and animateColor and flood-opacity of feFlood is animated,
both with several values.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2 | fail | no animation of flood-color with 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no animation of flood-color with animateColor |
e2005-12-19-72: §Q
discrete animation of the
flood-color property of a feFlood:
flood-color of feFlood is discrete animated
with several values including currentColor, starting with
red as currentColor, which is used every second time, the other
colours are blue, yellow and green.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | no currentColor |
Opera9tp1 | fail | no currentColor, last value green ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no currentColor |
e2010-08-28-01: §P
animation of the
attributes x and y of feFlood:
x and y of feFlood are animated.
A red rectangle behind has the same animation.
It if gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2010-08-28-02: §P
animation of the
attributes width and height of feFlood:
width and height of feFlood are animated.
A red rectangle behind has the same animation.
It if gets visible, an error is occured.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 3/5 |
feBlend blends two objects together, using specified modes.
e2005-12-20-01: §Q
animation of the
in and in2 attributes of a feBlend:
in and in2 of feBlend are exchanged after 5s for 5s.
The visible effect is, that the two referenced images
swap their rendering order.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | opacity of images wrong |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-20-02: §Q
animation of the
mode attribute of a feBlend:
mode of feBlend is set every 3s to another value,
using multiply, normal, screen, darken, lighten.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | opacity of images wrong |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2010-08-29-01: §P
feBlend with animated inputs:
feblend with mode normal is applied to rectangles with animated fill.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2 | fail | wrong 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2010-08-29-02: §P
feBlend with animated inputs:
feblend with mode multiply is applied to rectangles with animated fill.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bottom center wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2010-08-29-03: §P
feBlend with animated inputs:
feblend with mode screen is applied to rectangles with animated fill.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bottom center wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2010-08-29-04: §P
feBlend with animated inputs:
feblend with mode darken is applied to rectangles with animated fill.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bottom center wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2010-08-29-05: §P
feBlend with animated inputs:
feblend with mode lighten is applied to rectangles with animated fill.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bottom center wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | ok | - |
Opera10.60/ 11.00/11.60/ 12,00 | fail | wrong on the right |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
e2010-08-30-01: §P
feBlend with animated mode:
mode of feBlend is set every 3s to another value,
using normal, multiply, screen, darken, lighten.
The areas used as visible inputs for feBlend are indicated with stroked lines.
At some positions there are additional rectangles partly outside
without filter but with the same color for comparison.
If they differ from the filtered area, this indicates an error.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bottom center wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0 | ok | - |
Opera10.60/ 11.00/11.60/ 12,00 | fail | wrong on the right |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | filter area not displayed |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 2/8 |
With feMerge several filter primitives can be combined to one filter primitive.
e2005-12-20-10: §Q
animation of the
feMerge, feMergeNodes:
feMerge has no attributes specific for this element.
Two feMergeNodes are exchanged, one after 3s for 9s, another one after 6s for 3s.
As input are used feGaussianBlur, feOffset and feFlood.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no animation |
Opera9tp2/ beta1/2/ 9.00/9.10 | fail | no SourceAlpha |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0 | fail | no animation |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
With feSpecularLighting the specular component of the Phong lighting model can be applied to the source, using the alpha channel of the input. feDiffuseLighting and feSpecularLighting can be combined in an additional step. The Phong lighting model is a simple, not realistic model to simulate some surface and illumination effects. Authors and users should not expect to much...
e2005-12-20-21: §Q
animation of the
surfaceScale of feSpecularLighting:
surfaceScale of feSpecularLighting is animated within 30s
from small to large
with a yellow-white fePointLight from middle right
indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bigger differences, because color interpolation is wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong source position, wrong effect |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | wrong effect |
e2005-12-20-22: §Q
animation of the
specularConstant of feSpecularLighting:
specularConstant of feSpecularLighting is animated within 30s
with the values 0.01;0.1;1;10;100;1000 and
with a yellow-white fePointLight from middle right
indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bigger differences, because color interpolation is wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | fail | wrong effect |
e2005-12-20-23: §Q
animation of the
specularExponent of feSpecularLighting:
specularExponent of feSpecularLighting is animated within 30s
with the values 1;2;4;8;16;32;64;128 and
with a yellow-white fePointLight from middle right
indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10 | fail | bigger differences, because color interpolation is wrong |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | fail | wrong effect |
e2005-12-20-24: §Q
animation of the
lighting-color of feSpecularLighting:
lighting-color of feSpecularLighting is animated within 30s
with the values #ff0;#0ff;#f0f;#f00;#0f0;#00f;#ff0 and
with a fePointLight from middle right
indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | fail | wrong effect |
e2005-12-20-25: §Q
animation of the
lighting-color of feSpecularLighting with animateColor:
lighting-color of feSpecularLighting is animated within 30s
with the values #ff0;#0ff;#f0f;#f00;#0f0;#00f;#ff0 and
with a fePointLight from middle right
indicated with a black stroked circle with animateColor.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no animateColor |
e2005-12-20-26: §Q
discrete animation of the
lighting-color of feSpecularLighting:
lighting-color of feSpecularLighting is animated discrete within 30s
with the values currentColor;blue;currentColor;yellow;currentColor;green and
with a fePointLight from middle right
indicated with a black stroked circle. color is red.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | currentColor ignored |
Opera9tp1 | fail | currentColor ignored, last green value ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | currentColor ignored, wrong clipping |
Gecko 48.0/ 60.0 | fail | currentColor ignored, wrong clipping |
e2009-07-15-01: §Q
animation of the
kernelUnitLength of feSpecularLighting:
kernelUnitLength of feSpecularLighting is animated within 60s
from small to large.
fePointLight is indicated with a black stroked circle.
A rectangle top left indicates the current kernelUnitLength.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | attribute ignored, no 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,00 | fail | wrong position of light source |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | fail | wrong effect |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 0/7 |
With feDiffuseLighting the diffuse component of the Phong lighting model can be applied to the source, using the alpha channel of the input. feDiffuseLighting and feSpecularLighting can be combined in an additional step. The Phong lighting model is a simple, not realistic model to simulate some surface and illumination effects. Authors and users should not expect to much...
e2005-12-20-30: §Q
animation of the
surfaceScale of feDiffuseLighting:
surfaceScale of feDiffuseLighting is animated within 30s
from small to large (compared to z of a fePointLight from middle right
indicated with a black stroked circle).
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-31: §Q
animation of the
diffuseConstant of feDiffuseLighting:
diffuseConstant of feDiffuseLighting is animated within 30s
from small to large.
The fePointLight is indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-32: §Q
animation of the
kernelUnitLength of feDiffuseLighting:
kernelUnitLength of feDiffuseLighting is animated within 30s
from small to large.
The fePointLight is indicated with a black stroked circle.
A rectangle top left indicates the current kernelUnitLength.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | attribute ignored, no 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,00 | fail | wrong position of the light source |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | fail | wrong effect |
e2005-12-20-33: §Q
animation of the
lighting-color of feDiffuseLighting:
lighting-color of feDiffuseLighting is animated within 30s.
fePointLight is indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-34: §Q
animateColor animation of the
lighting-color of feDiffuseLighting:
lighting-color of feDiffuseLighting is animated
with animateColor within 30s.
fePointLight is indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2 | fail | no animateColor |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping, no animateColor |
Gecko 48.0/ 60.0 | fail | no animateColor |
e2005-12-20-35: §Q
discrete animation of the
lighting-color of feDiffuseLighting:
lighting-color of feDiffuseLighting is animated discrete within 30s
using the values currentColor;blue;currentColor;yellow;currentColor;green.
fePointLight is indicated with a black stroked circle.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | currentColor ignored |
Opera9tp1 | fail | currentColor ignored, last green value ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping, no currentColor |
Gecko 48.0/ 60.0 | fail | no currentColor |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 3/6 |
fePointLight is used to define a point light source for feDiffuseLighting or feSpecularLighting.
e2005-12-20-40: §P
animation of the
x and y of fePointLight in feDiffuseLighting:
x and y of fePointLight in feDiffuseLighting are animated
with several values and with repetition.
A small black circle indicates the position of the fePointLight.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60 | fail | wrong interpretation of attributes in correlation with kernelUnitLength |
Opera11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-41: §Q
animation of the
z of fePointLight in feDiffuseLighting:
z of fePointLight in feDiffuseLighting is animated
with several values and with repetition.
A white stroked circle indicates the center of the fePointLight and with the
diameter roughly the change of the appearence of a constant solid angle of
light.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60 | fail | wrong interpretation of attributes in correlation with kernelUnitLength |
Opera11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-42: §Q
animation of the
x,y and z of fePointLight in feDiffuseLighting:
x, y and z of fePointLight in feDiffuseLighting is animated
with several values and with repetition.
A white stroked circle indicates the center of the fePointLight and with the
diameter roughly the change of the appearence of a constant solid angle of
light.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | x and y (and z?) are related to the browser window and not to the coordinate system given by the viewBox (or in general the correct coordinate system) |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2009-07-14-01: §Q
animation of the
x,y and z of fePointLight in feDiffuseLighting:
x, y and z of fePointLight in feDiffuseLighting
with primitiveUnits objectBoundingBox
is animated with several values and with repetition.
A white stroked circle indicates the center of the fePointLight and with the
diameter roughly the change of the appearence of a constant solid angle of
light.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | wrong primitive units |
Opera9tp1 | fail | x and y (and z?) are related to the browser window and not to the coordinate system given by the viewBox (or in general the correct coordinate system); wrong primitive units |
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 | fail | wrong primitive units |
Gecko 2.0/ 8.0 | ok | - |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | wrong animation |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 2/4 |
feDistantLight is used to define a light source at infinite distance for feDiffuseLighting or feSpecularLighting.
e2005-12-20-50: §Q
animation of the
azimuth and elevation of feDistantLight in feDiffuseLighting:
azimuth and elevation of feDistantLight in feDiffuseLighting are animated.
azimuth is rotated once in 30s with repetition. elevation is set from 0
to 45 after 30s.
A white line indicates the direction to the light source including a simple
projection onto the canvas.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-51: §Q
animation of the
azimuth and elevation of feDistantLight in feDiffuseLighting:
azimuth and elevation of feDistantLight in feDiffuseLighting are animated.
elevation is rotated once in 30s with repetition. azimuth is set from 0
to 45 after 30s.
A line indicates the direction to the light source including a simple
projection onto the canvas. If the light source is in front of the object, the
line is white, else dark blue.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 2/2 |
feSpotLight is used to define a spot light source for feDiffuseLighting or feSpecularLighting.
e2005-12-20-60: §Q
animation of the
x and y of feSpotLight in feDiffuseLighting:
x and y of feSpotLight in feDiffuseLighting are animated
with several values and with repetition.
A white line indicates the direction of the light from the
source.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-61: §Q
animation of the
z of feSpotLight in feDiffuseLighting:
z of feSpotLight in feDiffuseLighting is animated
with several values and with repetition.
A white line indicates the direction of the light from the
source. The increase of the stroke-width is proportional
to z.
Note, that the phong modell used in SVG is in contradiction to the conservation of
energy. This becomes clearly visible when large z and small z presentations are
compared - if the light source is close to the object, the surface should be very bright
compared to the same source in a large distance.
Authors should recognise this if they animate light sources. For larger distances the
lighting-color has to be darkend according to the conservation of energy manually
(the same energy for the same solid angle and the same light source).
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-62: §Q
animation of the
pointsAtX and pointsAtY of feSpotLight in feDiffuseLighting:
pointsAtX and pointsAtY of feSpotLight in feDiffuseLighting are animated
with several values and with repetition.
A white line indicates the direction of the light from the
source.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-63: §Q
animation of the
pointsAtZ of feSpotLight in feDiffuseLighting:
pointsAtZ of feSpotLight in feDiffuseLighting are animated
with several values and with repetition.
A white line indicates the direction of the light from the
source. The increase of the stroke-width is proportional
to pointsAtZ.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-64: §Q
animation of the
limitingConeAngle of feSpotLight in feDiffuseLighting:
limitingConeAngle of feSpotLight in feDiffuseLighting is animated
with several values and with repetition.
Three white stroked circles indicate the radius of the limiting cone,
one on top of the circle, one in the middle for the square and
one at zero height. There has to be no light beyond those circles
within the related shapes.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | fail | slightly wrong limitingConeAngle |
Gecko 2.0/ 8.0 | fail | wrong clipping, wrong limitingConeAngle |
Gecko 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-20-65: §Q
animation of the
specularExponent of feSpotLight in feDiffuseLighting:
specularExponent of feSpotLight in feDiffuseLighting is animated
with several values and with repetition.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 6/6 |
feTurbulence generates pseudo random turbulence or fractal noise textures using the Perlin turbulence function.
e2005-12-21-01: §Q
animation of the
seed of feTurbulence:
seed of feTurbulence is animated, changing all 5s,
resulting in several random generated images.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | some vertical strokes perturbation |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-02: §Q
animation of the
numOctaves of feTurbulence:
numOctaves of feTurbulence is animated
in 45s, resulting in several images.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | some vertical strokes perturbation |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-03: §Q
animation of the
stitchTiles of feTurbulence:
stitchTiles of feTurbulence is switched from noStitch to stitch
after 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-04: §Q
animation of the
baseFrequency of feTurbulence:
baseFrequency of feTurbulence is animated
in 90s, resulting in several images.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | some vertical strokes perturbation |
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Opera9.00/9.10 | ko | no horizontal turbulence in 9.00, no display in 9.10 |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-05: §Q
animation of the
type of feTurbulence:
type of feTurbulence is switched from turbulence to fractalNoise
after 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | some vertical strokes perturbation |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-06: §Q
animation of
several attributes of feTurbulence:
several attributes of feTurbulence are animated
with repetition, resulting in several images.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | some vertical strokes perturbation |
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Opera9.00/9.10 | ko | no horizontal turbulence in 9.00, constant gray display in 9.10 |
Gecko 2.0 | fail | no animation of baseFrequency |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 6/6 |
feComposite combines two sources. The result depends on the used operator.
e2005-12-21-20: §Q
animation of the
in and in2 of feComposite:
in and in2 of feComposite are exchanged after 5s for 5s.
Because the operator is over, the visible effect is that the
painting order is changed for 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | opacity of images wrong |
Opera9tp1 | fail | no 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-21: §Q
animation of the
operator of feComposite:
operator of feComposite is exchanged all 3s,
first over, then in, out, atop, xor.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | opacity of images wrong, interpretation of attribute wrong, see the example from the specification for feComposite without animation too. |
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 | ok | the example from the specification for feComposite without animation is not completely correct in Opera9tp1 |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-21-22: §Q
animation of the
k1, k2, k3, k4 of feComposite:
k1, k2, k3, k4 of feComposite are animated each for 3s
from 0 to 1, starting after each other, the first one after 3s,
the initial value for all is 0.5.
After 15s and 18s are some fading effects added k2 in, k3 out
with k1 and k4 zero or k1 in, k4 out, k2 and k3 zero.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | interpretation of attribute wrong, see the example from the specification for feComposite without animation too. |
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 | ok | the example from the specification for feComposite without animation is not completely correct in Opera9tp1 |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 3/3 |
A matrix transformation in the color and alpha space can be done with feColorMatrix.
e2005-12-22-01: §Q
animation of the
values for feColorMatrix:
values for feColorMatrix with type saturate is animated
from 0 to 1 in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | * |
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 | ok | * |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | * |
* minor differences...
e2005-12-22-02: §Q
animation of the
values for feColorMatrix:
values for feColorMatrix with type hueRotate is animated
from 0 to 360 in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | * |
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 | ok | * |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | * |
* minor differences...
e2005-12-22-03: §Q
animation of the
type and values for feColorMatrix:
type and values for feColorMatrix are animated.
For the first 10s type is hueRotate and values is
animated from 0 to 360 in 10s. The next 10s type
is saturate and values is animated from 0 to 1 in
10s. Then the type is set to luminanceToAlpha.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | * |
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 | ok | * |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | * |
* minor differences...
e2005-12-22-04: §Q
animation of the
values for feColorMatrix with type matrix:
values for feColorMatrix with type matrix is animated
with different matrices after 3s for 30s. Final value
is a complete blue graphic.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1 | fail | blue finish ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 4/4 |
feDisplacementMap uses the pixel colour values from the image from in2 to displace in the x- or y-direction
the image from in.
Unfortunately the specifications gives no hint about
the purpose of this element, therefore these examples might be
not very useful.
It should be possible to offer a simple surface projection in the space x, y, z with z = function of x and y,
storing some x-y-structure in one graphic and the z-information together with the displacement in the
other graphic.
e2005-12-22-10: §Q
animation of the
scale, xChannelSelector, yChannelSelector,
in and in2 of feDisplacementMap:
scale, xChannelSelector, yChannelSelector,
in and in2 of feDisplacementMap are exchanged after 3s
with several values and combinations.
As images some additionally defined internal SVGs are
used, containing circles with different colours.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | wrong positioning of internal SVGs |
Opera9tp1 | fail | wrong scaling of filter coordinates, no display but correct positioning of internal 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,00 | fail | no display |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no display |
e2005-12-22-11: §Q
animation of the
scale, xChannelSelector, yChannelSelector,
in of feDisplacementMap,
animation of the
scale, xChannelSelector, yChannelSelector,
in of feDisplacementMap using images generated with feTurbulence:
scale, xChannelSelector, yChannelSelector,
in of feDisplacementMap are exchanged after 3s
with several values and combinations.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | wrong interpretation of one PNG, wrong interpretation of negative scale? |
Opera9tp1 | fail | wrong 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,00 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-22-12: §Q
feDisplacementMap
and feComposite with animated source
in feDisplacementMap an animated ellipse is
used to displace a portrait of the author.
The ellipse is rotated and the colour is
animated resulting in a changing displacement
with the shape of a rotated ellipse.
With feComposite the visible part of the
image is clipped to the animated ellipse.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no display |
e2009-07-22-01: §Q
feDisplacementMap
combined with animated gradient
A feDisplacementMap with a radial gradient is used to
displace a blue cross.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no display |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 1/4 |
Some color transformations can be applied with feComponentTransfer using the enclosed elements feFuncR, feFuncG, feFuncB, feFuncA.
e2005-12-23-01: §Q
animation of the
slope of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
slope of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type linear is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-23-02: §Q
animation of the
intercept of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
intercept of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type linear is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-23-03: §Q
animation of the
amplitude of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
amplitude of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type gamma is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | negative exponent interpreted as positive |
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 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-23-04: §Q
animation of the
exponent of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
exponent of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type gamma is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | negative exponent interpreted as positive |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-23-05: §Q
animation of the
offset of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
offset of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type gamma is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | negative exponent interpreted as positive |
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 | ok | - |
Gecko 2.0/ 8.0 | fail | wrong clipping |
Gecko 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-23-06: §Q
animation of the
tableValues of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
tableValues of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type table is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | funcA ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-23-07: §Q
animation of the
tableValues of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
tableValues of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
with type discrete is animated in 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | funcA ignored |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
e2005-12-23-08: §Q
animation of the
type of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer:
type of feFuncR, feFuncG, feFuncB, feFuncA in feComponentTransfer
is set from linear to identity after 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0 | fail | wrong clipping |
Gecko 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 8/8 |
Dilation or erosion can be applied to a source with feMorphology.
e2005-12-23-20: §Q
animation of the
operator and radius of feMorphology:
operator and radius of feMorphology are animated.
First operator is erode and radius is animated from
1 1 to 10 5 in 10s. Then operator is set to dilate and the
animation of radius is repeated.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Opera9.00/9.10 | ko | no display |
Gecko 2.0/ 8.0 | fail | wrong clipping, no text for erode |
Gecko 12.0/ 24.0 | fail | no text for erode |
Gecko 36.0/ 48.0/ 60.0 | ok | - |
feConvolveMatrix performs a matrix convolution filter effect on the source.
e2005-12-24-01: §Q
animation of the
divisor of feConvolveMatrix:
divisor of feConvolveMatrix is animated around the default
value after 3s for 20s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-24-02: §Q
animation of the
bias of feConvolveMatrix:
bias of feConvolveMatrix is animated around the default
value after 3s for 20s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | wrong display for negative bias, wrong animation |
Opera9tp1 | ok | - |
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 | fail | wrong display for negative bias, wrong animation |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | wrong display for negative bias, wrong animation |
e2005-12-24-03: §Q
animation of the
kernelUnitLength of feConvolveMatrix:
kernelUnitLength of feConvolveMatrix is animated with several
values after 3s for 20s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0 | fail | no animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0 | ok | - |
Gecko 48.0/ 60.0 | fail | wrong effect |
e2005-12-24-04: §Q
animation of the
targetX and targetY of feConvolveMatrix:
targetX and targetY of feConvolveMatrix are animated around the default
value after 3s for 20s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-24-05: §Q
animation of the
preserveAlpha of feConvolveMatrix:
preserveAlpha of feConvolveMatrix is set from
true to false after 3s for 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-24-06: §Q
animation of the
edgeMode of feConvolveMatrix
e2011-08-11-01: §Q
animation of the
edgeMode of feConvolveMatrix (2)
e2011-08-11-02: §Q
animation of the
edgeMode of feConvolveMatrix (3)
edgeMode of feConvolveMatrix is set from
none to wrap to dublicate each 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2 | fail | wrong display of wrap, but looks funny |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0 | ko | second and third example blurred |
Gecko 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-24-07: §Q
animation of the
kernelMatrix of feConvolveMatrix:
kernelMatrix of feConvolveMatrix is animated with several
values after 3s for 50s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
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 | ok | - |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
e2005-12-24-08: §Q
animation of the
kernelMatrix of feConvolveMatrix:
kernelMatrix of feConvolveMatrix is animated
from one matrix to another after 3s for 20s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | fail | no linear animation but discrete? |
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 | fail | no linear animation but discrete? |
Gecko 2.0/ 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no linear animation but discrete? |
e2005-12-24-09: §Q
animation of the
kernelMatrix and order of feConvolveMatrix:
kernelMatrix and order of feConvolveMatrix are set
to another value after 3s for 10s and then for
another 10s to another kernelMatrix and order
and then again another for 10s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta1/2 | fail | wrong display, order not animated? |
Opera9.00/9.10/ 9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0 | fail | no display for animation |
Gecko 8.0/ 12.0/ 24.0/ 36.0/ 48.0/ 60.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 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/ 60.0 | 6/9 |
Similar to color-interpolation for general use the color-interpolation-filters property determines the colour space used for filter operations.
e2005-12-25-01: §Q
animation of the
color-interpolation-filters:
color-interpolation-filters is set from sRGB to linearRGB
after 5s for 5s.
user-agent | result | comment |
---|---|---|
W3C-Validator | ok | SVG 1.1 |
Adobe | ok | - |
Opera9tp1/2/ beta2/ 9.00/9.10 | fail | no animation, property ignored |
Opera9 beta1 | fail | crashes immediately |
Opera9.50 alpha/beta/ 9.52/ 10.0 alpha/beta/ 10.0/ 10.60/ 11.00/11.60/ 12,00 | ok | - |
Gecko 2.0/ 8.0/ 24.0/ 36.0/ 48.0/ 60.0 | fail | no animation, property ignored |
Gecko 12.0 | ok | - |
user-agent | SVG 1.1 |
---|---|
user-agent | SVG 1.1 |
Adobe | 75/111 |
Squiggle 1.7 | 1/111 |
Opera9tp1 | 53/111 |
Opera9tp2 | 74/111 |
Opera9 beta1/2 | 79/111 |
Opera9.00/9.10 | 74/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/ 60.0 | 78/111 |