Full version, Basic version, Tiny version

Specification link: 19.2 Animation elements

animate-elem-82-t ← index → animate-elem-84-t

# animate-elem-83-t
SVG Image | PNG Image
$RCSfile: animate-elem-83-t.svg,v $ $Revision: 1.6 $ <animate> on <path>'s d attribute #1: from-to animation #2: to animation #3: values animation #4: from-to animation compatible H/h, V/v, L/l segments #5: from-to animation compatible C/c s/S segments #6: from-to animation compatible Q/q, T/t segments |

This test validates the operation of the animate element on the <path> element's d attribute.

The following descriptions references to the tests by number. The first test is the one showing on the top left. The last, sixth test is the one showing at the bottom right. Test numbers are alocated from left to right and from top to bottom. For each test, there are reference outline markers which show the expected animated shape at different times in the animation. At the time of the expected shape, the outline of the expected shape is drawn with a thick stroke for 0.2s so the test user can visually check that the shapes are matching at the expected times.

The first test validates a simple from-to animation on a path's d attribute made of M, C and Z commands where both the from and to attributes are specified. The attributes are compatible with the path element's d attribute.

The second test validates a simple to-animation on a path's d attribute made of M, C and Z commands where the to attribute is specified. The attribute is compatible with the path element's d attribute.

The third test validates a simple values-animation on a path's d attribute made of M, C and Z commands where the values attribute is specified and specifies three seperate values. The attribute is compatible with the path element's d attribute.

The fourth, fifth and sixth tests validate that interpolation between compatible path values (i.e., path values which normalize to the compatible values) is supported.

The fourth tests interpolation between a path value containing H, V and L commands (in the from value) and a path value containing compatible h, v and l commands (in the to value).

The fifth tests interpolation between a path value containing C and S commands (in the from value) and a path value containing compatible c and s commands (in the to value).

The sixth tests interpolation between a path value containing Q, T and A commands (in the from value) and a path value containing compatible q, t and a commands (in the to value).

animate-elem-82-t ← index → animate-elem-84-t