SMIL Animation

Résumé

Cette recommandation du W3C est une spécification de fonctionnalités d'animation pour les documents XML. La spécification décrit un cadre d'animation ainsi qu'un jeu d'éléments d'animation XML de base approprié pour une intégration aux documents XML. Elle est fondée sur le modèle de temporisation de SMIL 1.0, avec quelques extensions, et constitue un véritable sous-ensemble de SMIL 2.0. C'est un tremplin intermédiaire en termes de complexité de mise en œuvre pour les applications voulant des animations compatibles avec SMIL mais n'ayant pas besoin ou ne voulant pas de conteneurs temporels.

Statut de ce document

Cette section décrit le statut de ce document au moment de sa publication. D'autres documents peuvent venir le remplacer. Le dernier état de cette série de documents est conservé par le W3C.

Ce document a été revu par les membres du W3C et les tiers intéressés, et il a été approuvé par le Directeur comme recommandation du W3C. C'est un document stable qui peut être utilisé comme matériel de référence ou cité comme référence normative par un autre document. Le rôle du W3C en produisant la recommandation consiste à attirer l'attention sur la spécification et à promouvoir son large déploiement. Cela participe à améliorer la fonctionnalité et l'interopérabilité du Web.

La spécification SMIL Animation, produite dans le cadre de l'activité Synchronized MultiMedia du W3C, a été rédigée par le groupe de travail SYMM (accès réservé aux membres) du domaine Interaction du W3C, en coopération avec le groupe de travail SVG (accès réservé aux membres) du domaine Documents Formats du W3C. Les objectifs du groupe de travail SYMM sont exposés dans la charte du groupe de travail SYMM (accès réservé aux membres), révisée en juillet 2000 à partir de la version originale de la charte.

Le groupe de travail SYMM (accès réservé aux membres) estime que toutes les fonctionnalités de la spécification SMIL 2.0 ont été mises en œuvre au moins deux fois et sont interopérables. La charte du groupe de travail SYMM (accès réservé aux membres) décrit cela comme un développement indépendant des mises en œuvre par des organisations différentes et le passage avec succès de chaque test de la suite de tests SMIL 2.0 par au moins deux mises en œuvre. Les résultats de mise en œuvre sont publiés et servent uniquement à prouver que la mise en œuvre de SMIL 2.0 est possible. Il s'agit seulement d'un instantanné du comportement réel des mises en œuvre à un moment dans le temps, puisque ces mises en œuvre ne sont peut-être pas immédiatement disponibles pour le public. Les données d'interopérabilité ne sont pas destinées à évaluer ou à noter les performances d'une mise en œuvre individuelle.

Des divulgations de brevets et des engagements de licence sont attachés à la spécification SMIL 2.0 (et donc aussi à la spécification SMIL Animation), et on peut les consulter sur la page des déclarations de brevets du SYMM conformément à la politique du W3C.

Veuillez signaler les erreurs dans ce document à www-smil@w3.org. La liste des erreurs connues dans cette spécification est disponible à http://www.w3.org/2001/09/REC-smil-animation-20010904-errata.

On peut trouver la liste des recommandations et des autres documents courants du W3C à http://www.w3.org/TR.

Table des matières abrégée

Table des matières détaillée

1. Introduction

Ce document décrit un cadre pour incorporer une animation sur une ligne du temps et un mécanisme pour composer les effets de plusieurs animations. On décrit également un jeu d'éléments d'animation de base applicable à n'importe quel langage basé sur [XML]. On appelle le langage auquel ce module est intégré le langage hôte. On appelle le document qui contient les éléments d'animation le document hôte.

Une animation est par nature fonction du temps. La spécification SMIL Animation est définie dans les termes du modèle de temporisation SMIL. Les capacités d'animation sont décrites par des éléments nouveaux, avec les attributs et la sémantique associés, tout comme les attributs de temporisation SMIL. L'animation est modélisée comme une fonction changeant la valeur présentée d'un attribut particulier dans le temps.

Le modèle de temporisation est fondé sur SMIL 1.0 [SMIL1.0], avec quelques changements et extensions pour gérer des fonctionnalités de temporisation supplémentaires. La spécification SMIL Animation utilise un modèle de temporisation plat simplifié, sans conteneur de temps (tels que les éléments par ou seq). Cette version de SMIL Animation ne peut pas être utilisée avec des documents soumis par ailleurs à une temporisation. Cf. également la section Les définitions et contraintes obligatoires de la temporisation des éléments.

Quoique ce document définisse un ensemble de base de capacités d'animation, on suppose que les langages hôtes en tireront peut-être parti pour définir des éléments d'animation supplémentaires ou plus spécialisés. Pour assurer la cohérence du modèle auprès des auteurs de documents et des développeurs de moteurs d'exécution, nous introduisons un cadre pour intégrer l'animation au modèle de temporisation de SMIL. L'animation manipule seulement les attributs et propriétés des éléments cibles, et elle n'a donc pas besoin d'une connaissance spécifique de la sémantique de l'élément cible.

Les exemples dans ce document qui incluent une syntaxe de langage hôte utilisent les langages SMIL, SVG, XHTML et CSS. Ils sont fournis comme indication d'intégrations possibles à des langages hôtes variés.

2. Aperçu et terminologie

2.1. Les bases de l'animation

On définit l'animation comme la manipulation en fonction du temps d'un élément cible (ou plus précisément d'un certain attribut de l'élément cible : l'attribut cible). L'animation définit une application du temps aux valeurs de l'attribut cible. Cette application tient compte de tous les aspects de la temporisation, ainsi que de la sémantique propre à l'animation.

Les animations définissent un début et une durée simple qui peut être répétée. Chaque animation définit une fonction d'animation qui produit une valeur de l'attribut cible à chaque instant dans la durée simple. L'auteur peut définir pendant combien de temps et combien de fois la fonction d'animation devrait se répéter. La durée simple combinée à un comportement de répétition définit la durée active.

L'attribut cible est le nom d'une caractéristique d'un élément cible comme défini dans le document de langage hôte. Ça peut être (par exemple) un attribut XML contenu dans l'élément ou bien une propriété CSS appliquée à l'élément. Par défaut, l'élément cible d'une animation sera le parent de l'élément d'animation (l'élément d'animation est typiquement un sous-élément de l'élément cible). Toutefois, la cible peut être n'importe quel élément dans le document, identifié soit par une référence ID, soit via une référence de localisateur XLink [XLink].

Comme exemple simple, voici la définition d'une animation de forme rectangulaire SVG. Le rectange variera d'une forme allongée mince à une forme aplatie large.

<rect ...>
   <animate attributeName="width"  from="10px"  to="100px" 
            begin="0s" dur="10s" />
   <animate attributeName="height" from="100px" to="10px"
            begin="0s" dur="10s" />
</rect>

Le rectangle débute par une largeur de 10 pixels augmentant jusqu'à 100 pixels pendant 10 secondes. Au cours de ces mêmes dix secondes, la hauteur du rectangle varie de 100 pixels à 10 pixels.

Lorsque l'animation se déroule, elle ne devrait pas changer réellement les valeurs d'attributs dans le modèle objet du document (DOM) [DOM2Core]. Le moteur d'animation devrait conserver une valeur de présentation pour chaque attribut animé, distincte du DOM ou du modèle objet CSS (CSS OM). Si la mise en œuvre ne gère pas de modèle objet, elle devrait conserver la valeur originale telle que définie par le document ainsi que la valeur de présentation. La valeur de présentation se reflète dans la forme affichée du document. Les animations manipulent donc la valeur de présentation et ne devraient pas affecter la valeur de base exposée par le DOM ou le CSS OM. Cela est précisé dans la section Le modèle d'animation en sandwich.

Au besoin, la mise en œuvre évalue la fonction d'animation au cours du temps et les valeurs obtenues sont appliquées à la valeur de présentation de l'attribut cible. Les fonctions d'animation sont continues dans le temps et peuvent être échantillonnées à toute cadence d'images appropriée pour le système de rendu. La représentation syntaxique de la fonction d'animation est indépendante de ce modèle et on peut la décrire de plusieurs façons. Les éléments d'animation dans cette spécification gèrent la syntaxe d'un jeu de valeurs discrètes ou interpolées, une syntaxe de tracé pour un mouvement basé sur les tracés SVG, une temporisation par images clés, une interpolation à vitesse régulière et des variantes de ces fonctionnalités. Les fonctions d'animation auraient pu être définies comme entièrement ou partiellement algorithmiques (par exemple, une fonction à valeur aléatoire ou une animation de mouvement suivant la position de la souris). Dans tous les cas, l'animation expose cela comme une fonction du temps.

La valeur de présentation reflète l'effet de l'animation sur la valeur de base. L'effet est le changement de la valeur de l'attribut cible à tout instant donné. Lorsqu'une animation se termine, l'effet de l'animation cesse de s'appliquer et la valeur de présentation revient par défaut à la valeur de base. L'effet de l'animation peut aussi être prolongé afin de figer la dernière valeur pour le restant de la durée du document.

On peut définir les animations pour remplacer ou bien pour ajouter à la valeur de base de l'attribut. Dans ce contexte, la valeur de base peut être la valeur du DOM ou le résultat d'autres animations visant aussi le même attribut. Ce concept plus général de valeur de base est appelé valeur sous-jacente. Les animations qui ajoutent à la valeur sous-jacente sont dites additives. Les animations qui remplacent la valeur sous-jacente sont dites non additives.

2.2. Les valeurs des fonctions d'animation

Beaucoup d'animations définissent la fonction d'animation f(t) comme une succession de valeurs à appliquer dans le temps. Pour certains types d'attributs (par exemple, les nombres), on peut également décrire une fonction d'interpolation entre des valeurs.

Comme forme simple de description de valeurs, les éléments d'animation peuvent indiquer une valeur pour l'attribut from et une valeur pour l'attribut to. Si l'attribut admet une valeur propice à l'interpolation (par exemple, un nombre), la fonction d'animation peut interpoler les valeurs dans l'intervalle défini par les attributs from et to au cours de la durée simple. Une variante utilise la valeur de l'attribut by à la place de celle de l'attribut to pour indiquer un changement additif sur l'attribut.

Les formes plus complexes définissent une liste de valeurs ou même la description d'un tracé de mouvement. Les auteurs peuvent également contrôler la temporisation des valeurs pour décrire des animations à images clés, et des fonctions plus complexes encore.

2.3. Les symboles utilisés dans les descriptions sémantiques

f(t)

La fonction d'animation simple associant les temps dans la durée simple aux valeurs de l'attribut cible (0 <= t <= durée simple). Remarquez, tandis que F(t) définit l'application de l'animation entière, que f(t) suit un modèle simplifié qui manipule juste la durée simple.

F(t)

L'effet d'une animation pour n'importe quel point de l'animation. Elle fait correspondre un temps non négatif à une valeur de l'attribut cible. Un temps de valeur "0" correspond au temps où l'animation débute. Remarquez que F(t) combine la fonction d'animation f(t) avec tous les autres aspects de l'animation et des contrôles de temporisation.

3. Le modèle d'animation

Cette section décrit la syntaxe et la sémantique des attributs pour décrire les animations. Les éléments spécifiques ne sont pas décrits ici, mais plutôt les concepts et syntaxe communs qui composent le modèle d'animation. On décrit les problèmes des documents, ainsi que les méthodes pour viser un élément pour une animation. On définit ensuite le modèle d'animation, en allant des concepts les plus simples aux les plus complexes : d'abord la durée simple et la fonction d'animation f(t), puis le comportement global de F(t). Enfin, on présente le modèle pour combiner les animations et on décrit les informations supplémentaires concernant la temporisation de l'animation.

Le modèle temporel dépend de plusieurs définitions pour le document hôte : le document hôte est présenté pendant un certain intervalle de temps. On appelle le début de l'intervalle où le document est présenté le début du document. La fin de l'intervalle où le document est présenté est appelée fin du document. La différence entre ce début et cette fin est appelée durée du document. Les définitions formelles de la présentation, du début et de la fin du document sont laissées au concepteur du langage hôte (cf. également la section Les définitions obligatoires du langage hôte).

3.1. La définition de la cible d'animation

La cible d'animation est définie comme étant un attribut spécifique d'un élément particulier. Les méthodes pour définir l'attribut cible et l'élément cible sont précisées dans cette section.

L'attribut cible

L'attribut cible à animer est indiqué par l'attribut attributeName. La valeur de cet attribut est une chaîne indiquant le nom de l'attribut cible comme défini dans le langage hôte.

Les attributs d'un élément animable sont souvent définis par des langages différents et/ou dans des espaces de nommage différents. Par exemple, dans beaucoup d'applications XML, la position d'un élément (qui est un attribut cible typique) est définie par une propriété CSS au lieu d'un attribut XML. Parfois, le même nom d'attribut est associé aux attributs et propriétés de plusieurs langages ou espaces de nommage. Pour permettre à l'auteur de lever l'ambiguïté de l'association de nom, un attribut supplémentaire attributeType pour indiquer l'interprétation attendue est fourni.

L'attribut attributeType est optionnel. Par défaut, le moteur d'animation résoudra les noms selon la règle suivante : s'il y a un conflit de noms et que l'attribut attributeType n'est pas défini, la liste de propriétés CSS gérées par le langage hôte est associée en premier (si CSS est géré dans le langage hôte) ; si aucune association CSS n'est faite (ou si CSS ne s'applique pas), l'espace de nommage par défaut de l'élément cible sera associé.

Si l'attribut cible est défini dans un espace de nommage XML différent de celui par défaut de l'élément cible, alors l'auteur doit définir l'espace de nommage de l'attribut cible en utilisant le préfixe d'espace de nommage associé défini dans la portée de l'élément d'animation. Le préfixe est ajouté devant la valeur de l'attribut attributeName.

Cf. [XML-NS] pour des précisions sur les espaces de nommage XML.

attributeName = <attributeName>

Indique le nom de l'attribut cible. On peut utiliser un préfixe xmlns pour indiquer l'espace de nommage XML de l'attribut. Le préfixe sera interprété dans la portée de l'élément d'animation.

attributeType = "CSS | XML | auto"

Indique l'espace de nommage où sont définis l'attribut cible et les valeurs associées. La valeur de l'attribut est l'une des suivantes (les valeurs sont sensibles à la casse) :

"CSS"

Elle indique que la valeur de l'attribut attributeName est le nom d'une propriété CSS comme définie pour le document hôte. Cette valeur d'argument n'est significative que dans les environnements de langages hôtes gérant CSS.

"XML"

Elle indique que la valeur de l'attribut attributeName est le nom d'un attribut XML défini dans l'espace de nommage XML par défaut de l'élément cible. Remarquez que si la valeur de l'attribut attributeName a un préfixe xmlns, alors la mise en œuvre doit utiliser l'espace de nommage associé comme défini dans la portée de l'élément d'animation.

"auto"

La mise en œuvre devrait associer la valeur de l'attribut attributeName à un attribut de l'élément cible. La mise en œuvre doit d'abord explorer la liste des propriétés CSS à la recherche d'un nom de propriété correspondant et, si elle n'en trouve pas, explorer ensuite l'espace de nommage XML par défaut de l'élément.
C'est la valeur par défaut.

L'élément cible

Un élément d'animation peut définir l'élément cible d'animation explicitement ou bien implicitement. La définition explicite utilise un attribut pour indiquer l'élément cible. Sa syntaxe est décrite ci-dessous.

Si aucune cible explicite n'est indiquée, alors l'élément cible implicite est l'élément parent de l'élément d'animation dans l'arbre du document. La situation courante attendue est celle où l'élément d'animation sera déclaré comme enfant de l'élément à animer. Auquel cas, il est inutile d'indiquer une cible explicite.

Si la référence d'un élément cible explicite ne peut pas être résolue (par exemple, si l'élément est introuvable), l'animation est sans effet. Et de même si l'élément cible (implicite ou explicite) ne gère pas l'attribut cible indiqué. Cf. également la section Le traitement des erreurs de syntaxe.

Les deux attributs suivants peuvent servir à identifier explicitement l'élément cible :

targetElement = "<IDREF>"

Cet attribut indique l'élément cible à animer. La valeur d'attribut doit être celle de l'identificateur d'attribut XML d'un élément dans le document hôte. Pour une définition formelle du type IDREF, se reporter à la spécification XML 1.0 [XML].

href = uri-reference

Cet attribut définit un localisateur XLink qui se rapporte à l'élément cible à animer.

Pour l'intégration d'éléments d'animation dans un langage hôte, le concepteur du langage devrait éviter d'inclure ces deux attributs en même temps. Si malgré tout le concepteur du langage hôte choisit d'inclure les deux attributs, les deux étant définis sur un élément d'animation donné, alors l'attribut XLink href a priorité sur l'attribut targetElement.

L'utilisation de l'attribut targetElement présente l'avantage d'une syntaxe de la valeur d'attribut plus simple, comparée à celle de l'attribut href. L'avantage d'utiliser l'attribut XLink href est qu'il pourra s'étendre vers un mécanisme de liaison complet dans les versions futures de SMIL Animation, et que les processeurs XLink génériques peuvent traiter l'élément d'animation. La forme XLink sert également pour les langages hôtes conçus pour utiliser XLink avec toutes ces références. Les deux exemples suivants illustrent ces deux approches.

Cet exemple utilise la syntaxe plus simple de l'attribut targetElement :

<animate targetElement="foo" attributeName="bar" .../>

Cet exemple utilise la syntaxe plus flexible du localisateur XLink, avec une cible équivalente :

<foo xmlns:xlink="http://www.w3.org/1999/xlink">
   ...
   <animate xlink:href="#foo" attributeName="bar" .../>
   ...
</foo>

Si on utilise un attribut XLink href sur un élément d'animation, les attributs XLink supplémentaires suivants doivent être définis dans le langage hôte. On peut les définir dans une définition DTD, ou le langage hôte peut leur imposer dans la syntaxe du document de gérer les processeurs XLink génériques. Cf. le langage de liaison XML (XLink) [XLink] pour des précisions.

La spécification XLink impose les attributs XLink suivants. Les valeurs sont fixes, et elles peuvent donc être définies comme telles dans une définition DTD. Tous les autres attributs XLink sont optionnels et n'affectent pas la sémantique de SMIL Animation.

type = "simple"

Identifie le type de lien XLink utilisé. Pour relier l'élément cible, on utilise un lien simple et la valeur d'attribut doit donc être "simple".

actuate = "onLoad"

Indique que le lien vers l'élément cible est suivi automatiquement (c'est-à-dire sans intervention de l'utilisateur).

show = "embed"

Indique que la référence n'inclut pas d'autre contenu dans le fichier.

Les informations supplémentaires concernant la spécification de l'élément cible, en rapport avec le document hôte et le langage hôte, sont fournies dans la section Les définitions et contraintes obligatoires des cibles d'animation.

3.2. La définition de la fonction d'animation f(t)

Chaque fonction d'animation définit la valeur de l'attribut à un moment donné dans le temps. L'intervalle de temps pour lequel la fonction d'animation est définie est la durée simple. La fonction d'animation ne produit pas de résultat défini pour les temps en dehors de l'intervalle allant de "0" à la valeur de la durée simple.

3.2.1. La temporisation de la fonction d'animation

La temporisation de base d'un élément est décrite avec les attributs begin et dur. Les auteurs peuvent indiquer le temps de début d'une animation de plusieurs façons, depuis les temps d'horloge simples jusqu'au temps où se produit un événement comme un clic de souris. La longueur de la durée simple est indiquée par l'attribut dur. La syntaxe de cet attribut est décrite plus loin. Les règles de syntaxe normatives de chaque variante de valeur d'attribut sont décrites dans la section Les grammaires des valeurs d'attributs de temporisation. Un résumé de la syntaxe est fourni ici pour aider le lecteur.

Cette section est normative

La sémantique de la valeur de l'attribut begin

Cette section est normative

• Si aucun attribut begin n'est défini, la temporisation par défaut équivaut à une valeur de décalage de "0" ;
• S'il y a une erreur de syntaxe pour une valeur individuelle dans la liste des valeurs de début ou de fin (c'est-à-dire que les valeurs ne sont pas conformes à la syntaxe définie pour une valeur de temps), le langage hôte doit définir comment l'agent utilisateur en tient compte ;
• Une valeur de temps peut être conforme à la syntaxe définie et pourtant être invalide (par exemple, si un élément inconnu est appelé par son ID dans une valeur de base de synchronisation). Si une erreur d'évaluation de ce type advient pour une valeur individuelle de la liste des valeurs de début ou de fin, alors la valeur individuelle sera traitée comme si la valeur "indefinite" était indiquée, et le restant de la liste ne sera pas traité normalement. Si aucune valeur légale n'est définie pour l'attribut begin (ou bien end), l'élément suppose la valeur "indefinite" pour begin (ou end).

Cette section est informative

La valeur de l'attribut begin peut définir une liste de temps. On peut l'utiliser pour indiquer plusieurs façons ou règles de débuter un élément, par exemple, si l'un de plusieurs événements se produit. La liste de temps peut aussi définir plusieurs temps de début, permettant la lecture à plusieurs reprises de l'élément (ce comportement peut être contrôlé, par exemple, pour utiliser seulement le début le plus ancien — cf. également la section La relance des animations).

En général, le temps le plus ancien dans la liste détermine le temps de début de l'élément. Il y a des contraintes supplémentaires pour l'évaluation de la liste des temps de début, qui sont précisées dans la section L'évaluation des listes de temps de début et de fin.

Bien qu'il soit légal d'inclure la valeur "indefinite" dans la liste de valeurs de l'attribut begin, remarquez qu'elle n'est réellement utile que comme valeur unique. En combinaison avec d'autres valeurs, elle n'agit pas sur la temporisation de début, puisqu'on peut appeler les méthodes de début du DOM en indiquant ou non la valeur "indefinite" pour l'attribut begin.

La manipulation des décalages négatifs de début

Cette section est informative

L'utilisation de décalages négatifs pour définir les temps de début définit simplement les relations de synchronisation de l'élément. Elle ne remplace en aucune façon les contraintes du conteneur de temps sur l'élément, et elle ne peut pas remplacer les contraintes de temps de présentation.

Cette section est normative

• Le décalage calculé relatif au temps de début du document peut être négatif ;
• On peut définir un temps de début avec un décalage négatif relatif à un événement ou à une base de synchronisation initialement non résolus. Au moment de la résolution du temps de base de synchronisation ou de base d'événement, le temps calculé peut se trouver dans le passé.

Le temps de début calculé définit la relation de synchronisation programmée de l'élément, même s'il n'est pas possible de débuter l'élément au temps calculé. Le modèle temporel utilise le temps de début calculé, et non le temps observé du début de l'élément.

Cette section est normative

• Si le temps de début résolu se trouve dans le passé (c'est-à-dire avant le temps de présentation courant), l'élément débute immédiatement mais agit comme s'il avait débuté au temps défini (en lecture après un décalage dans le média).

L'élément débutera en fait au temps calculé d'après l'algorithme suivant :

Soit o la valeur de décalage d'une valeur de début donnée,
 d la durée simple associée,
 AD la durée active associée.
Soit rAt le temps de résolution du début.
Soit rTo le temps de base de synchronisation ou de base d'événement sans décalage
Soit rD valant rTo - rAt. Si rD < 0 alors rD est fixé à 0.
 
Si AD n'est pas définie, elle est supérieure à toute valeur de o ou ABS(o).
REM( x, y ) est défini par x - (y * floor( x/y )). 
Si y n'est pas défini, REM( x, y ) vaut simplement x.

Soit mb = REM( ABS(o), d ) - rD

Si ABS(o) >= AD alors l'élément ne débute pas.
Autrement si mb >= 0 alors le média débute à mb.
Sinon le média débute à mb + d.

Si l'élément se répète, la valeur d'itération de l'événement repeat prend la valeur calculée d'après le temps de début calculé ci-dessus, et non le nombre de répétitions observées.

Cette section est informative

Ainsi par exemple :

<animate begin="foo.click-8s" dur="3s" repeatCount="10" .../>

L'animation débute lorsque l'utilisateur clique sur l'élément "foo". Son temps de début calculé est en réalité 8 secondes plus tôt, et sa lecture débute donc à 2 secondes dans la durée simple de trois secondes de la troisième itération de répétition. La quatrième itération de l'élément débutera une seconde plus tard et l'événement repeat associé aura la valeur d'itération "3" (celle-ci commençant à zéro). L'élément se terminera 22 secondes après le clic. L'événement beginEvent est suscité lorsque l'élément débute, mais il a une valeur d'estampille correspondant au temps de début défini, qui est 8 secondes plus tôt. Tous les dépendants temporels sont activés relativement au temps de début calculé et non au temps de début observé.

Remarque : Si les auteurs de scripts souhaitent distinguer les itérations de répétion calculées des itérations de répétition observées, ils peuvent compter les événements repeat réels dans le gestionnaire d'événement associé.

Si aucun attribut begin n'est défini, la valeur par défaut est "0" (l'animation débute avec le document). S'il y a une erreur dans la syntaxe de la valeur d'argument de l'attribut begin, la valeur par défaut de begin sera utilisée.

Si l'animation n'a pas d'attribut dur, la durée simple n'est pas définie. Remarquez que l'interpolation ne fonctionnera pas si la durée simple n'est pas définie (quoique cela puisse toujours être utile pour les éléments set). Cf. également L'interpolation et les durées simples non définies.

S'il y a une erreur dans la syntaxe de la valeur d'argument de l'attribut dur, l'attribut sera ignoré (comme s'il n'avait pas été défini), et la durée simple ne sera donc pas définie.

Si la valeur de début est définie valoir "indefinite" ou définit une base d'événement, le temps du début n'est en réalité pas connu tant que l'élément n'est pas activé (par exemple, avec un hyperlien, l'appel d'une méthode du DOM ou l'événement appelé). Lorsqu'il n'est pas connu, on dit que le temps est non résolu. Le temps devient résolu au point où le début de l'élément est activé. Cela est décrit en détails dans la section L'unification de la temporisation interactive et de la temporisation programmée.

Exemples

Les exemples suivants définissent tous un début à minuit le 1^er janvier 2000 UTC :

begin="wallclock(2000-01-01Z)"
begin="wallclock( 2000-01-01T00:00Z )"
begin="wallclock( 2000-01-01T00:00:00Z )"
begin="wallclock( 2000-01-01T00:00:00.0Z )"
begin="wallclock( 2000-01-01T00:00:00.0Z )"
begin="wallclock( 2000-01-01T00:00:00.0-00:00 )"

L'exemple suivant définit un début à 15 h 30 le 28 juillet 1990 dans le fuseau horaire des États-Unis sur le Pacifique :

begin="wallclock( 1990-07-28T15:30-08:00 )"

L'exemple suivant définit un début à 8 heures du matin à chaque fois que le document y est présenté :

begin="wallclock( 08:00 )"

3.2.2. Les valeurs de la fonction d'animation

Outre l'attribut cible et la temporisation, l'animation doit indiquer comment changer sa valeur au cours du temps. On peut décrire une animation soit comme une liste de valeurs de l'attribut values, soit dans une forme simplifiée avec les valeurs des attributs from, to et by.

from = "<valeur>"

Définit la valeur de départ de l'animation.

to = "<valeur>"

Définit la valeur d'arrivée de l'animation.

by = "<valeur>"

Définit une valeur de décalage relatif pour l'animation.

values = "<liste>"

Une liste d'une ou plusieurs valeurs, séparées par des points-virgules. Les attributs à valeurs vectorielles sont gérés au travers de la syntaxe vectorielle du domaine attributeType.

Si on utilise une liste de valeurs, l'animation appliquera les valeurs dans l'ordre au cours de l'animation (le rythme et l'interpolation entre ces valeurs sont décrites dans la section suivante). Si on définit une liste pour l'attribut values, les valeurs des attributs from, to et by sont toutes ignorées.

La syntaxe from/to/by plus simple comporte plusieurs variantes. Pour utiliser une variante, il faut définir l'un ou l'autre des attributs by ou to, la valeur de l'attribut from étant optionnelle. Il est illégal de définir les deux attributs by et to : si les deux sont définis, seul l'attribut to sera utilisé (l'attribut by sera ignoré). Les combinaisons d'attributs produisent les classes d'animation suivantes :

L'animation from-to

Indiquer une valeur from et une valeur to définit une animation simple équivalant à une liste values de deux valeurs. La fonction d'animation est définie pour commencer à la valeur from et finir à la valeur to.

L'animation from-by

Indiquer une valeur from et une valeur by définit une animation simple où la fonction d'animation est définie pour commencer à la valeur from et la changer au cours de la durée simple d'une valeur delta indiquée par l'attribut by. On ne peut l'utiliser qu'avec les attributs gérant l'addition (par exemple, la plupart des attributs numériques).

L'animation by

Indiquer uniquement une valeur by définit une animation simple où la fonction d'animation est définie pour décaler la valeur sous-jacente de l'attribut d'une valeur delta variant au cours de la durée simple, en commençant avec un delta de "0" et en finissant au delta indiqué par l'attribut by. On ne peut l'utiliser qu'avec les attributs gérant l'addition.

L'animation to

Elle décrit une animation où la fonction d'animation est définie pour commencer avec la valeur sous-jacente de l'attribut et finir avec la valeur indiquée par l'attribut to. Avec cette forme, l'auteur peut décrire une animation qui débutera à une valeur courante de l'attribut et se terminera à la valeur to souhaitée.

Les deux dernières formes animation by et animation to ont des contraintes sémantiques supplémentaires lorsqu'elles sont combinées avec d'autres animations. Cela est précisé ci-dessous dans la section Comment les attributs from, to et by affectent-ils le comportement additif.

Les valeurs d'animation définies dans l'élément d'animation doivent être des valeurs légales pour l'attribut indiqué. Cf. également la section Le détail des valeurs de la fonction d'animation.

Les caractères blancs de tête et de queue, ainsi que ceux avant et après les séparateurs points-virgules, sont ignorés.

Si toutes les valeurs (c'est-à-dire les valeurs arguments des attributs from, to, by ou values) sont illégales, alors l'animation sera sans effet (cf. également la section Le traitement des erreurs de syntaxe). Et de même, si aucun des attributs from, to, by ou values n'est défini.

L'interpolation et les durées simples non définies

Si la durée simple d'une animation n'est pas définie (par exemple, si aucune valeur n'est définie pour l'attribut dur), l'interpolation est en général dénuée de sens. Bien qu'il soit possible de définir une fonction d'animation non basée sur une durée simple définie (par exemple, un certain algorithme à nombres aléatoires), la plupart des animations définit la fonction d'interpolation par rapport à la durée simple. Si une fonction d'animation est définie par rapport à la durée simple et que cette durée simple n'est pas définie, alors la première valeur de la fonction d'animation (c'est-à-dire f(0)) devrait être utilisée (en fait comme une constante) pour la fonction d'animation.

Exemples

L'exemple suivant avec la syntaxe values anime la largeur d'une forme SVG sur une course de 10 secondes, en interpolant depuis une largeur de 40 jusqu'à 100, et retour à 40.

<rect ...>
   <animate attributeName="width" values="40;100;40" dur="10s"/>
</rect>

L'exemple d'animation from-to suivant anime la largeur d'une forme SVG sur une course de 10 secondes depuis une largeur de 50 jusqu'à 100.

<rect ...>
   <animate attributeName="width" from="50" to="100" dur="10s"/>
</rect>

L'exemple d'animation from-by suivant anime la largeur d'une forme SVG sur une course de 10 secondes depuis une largeur de 50 jusqu'à 75.

<rect ...>
   <animate attributeName="width" from="50" by="25" dur="10s"/>
</rect>

L'exemple d'animation by suivant anime la largeur d'une forme SVG sur une course de 10 secondes depuis la largeur originale de 40 jusqu'à 70.

<rect width="40"...>
   <animate attributeName="width" by="30" dur="10s"/>
</rect>

L'exemple d'animation to suivant anime la largeur d'une forme SVG sur une course de 10 secondes depuis la largeur originale de 40 jusqu'à 100.

<rect width="40"...>
   <animate attributeName="width" to="100" dur="10s"/>
</rect>

3.2.3. Les modes de calcul de la fonction d'animation

Par défaut, une interpolation linéaire simple est appliquée aux valeurs, espacée régulièrement sur la durée de l'animation. On peut utiliser des attributs supplémentaires pour un contrôle plus fin de l'interpolation et de la temporisation des valeurs. L'attribut calcMode définit la méthode d'application des valeurs à l'attribut en question. L'attribut keyTimes apporte un contrôle supplémentaire de la temporisation de la fonction d'animation, en associant un temps à chaque valeur de la liste de l'attribut values (ou aux points dans la description de tracé de l'attribut path d'un élément animateMotion, cf. la section L'élément animateMotion). Enfin, l'attribut keySplines permet de contrôler le rythme de l'interpolation entre les valeurs de la liste de l'attribut values.

calcMode = "discrete | linear | paced | spline"

Indique le mode d'interpolation de l'animation. Il peut prendre l'une des valeurs suivantes. Le mode par défaut est "linear", toutefois si l'attribut ne gère pas l'interpolation linéaire (par exemple, pour des chaînes), l'attribut calcMode est ignoré et une interpolation discrète est utilisée.

"discrete"

Cela signifie que la fonction d'animation sautera d'une valeur à la suivante sans interpolation.

"linear"

On utilise une interpolation linéaire simple entre les valeurs pour calculer la fonction d'animation.
C'est la valeur par défaut de l'attribut calcMode.

"paced"

Définit une interpolation qui produit une cadence de changement régulière tout au long de l'animation. Elle est seulement gérée pour les valeurs définissant un intervalle numérique linéaire, et pour lesquelles on peut calculer une certaine notion de distance entre les points (par exemple, la position, la largeur, la hauteur, etc.). Si la valeur "paced" est indiquée, les éventuels attributs keyTimes ou keySplines seront ignorés.

"spline"

Interpole depuis une valeur à la suivante dans la liste de l'attribut values conformément à une fonction de temps définie par une spline de Bézier cubique. Les points de la spline sont définis par l'attribut keyTimes et les points de contrôle de chaque intervalle sont définis par l'attribut keySplines.

keyTimes = "<liste>"

Une liste de valeurs de temps, séparées par des points-virgules, utilisée pour contrôler le rythme de l'animation. Chaque temps dans la liste correspond à une valeur dans la liste de l'attribut values et définit quand la fonction d'animation devrait utiliser cette valeur. Chaque valeur de temps dans la liste de l'attribut keyTimes est indiquée par une valeur en virgule flottante entre 0 et 1 (inclus) représentant un décalage proportionnel dans la durée simple de l'élément d'animation.

Si une liste d'attribut keyTimes est définie, alors il doit y avoir autant de valeurs exactement dans cette liste que dans la liste de l'attribut values.

Chaque valeur de temps successive doit être supérieure ou égale à la valeur de temps précédente.

La sémantique de la liste de l'attribut keyTimes dépend du mode d'interpolation :

• Pour les animations de type "linear" et "spline", la première valeur de temps dans la liste doit être "0" et la dernière doit être "1". La valeur keyTime associée à chaque valeur définit quand la valeur est fixée ; les valeurs sont interpolées entre les valeurs-clés keyTimes ;
• Pour l'animation de type "discrete", la première valeur de temps dans la liste doit être "0". Le temps associé à chaque valeur définit quand la valeur est fixée ; la fonction d'animation emprunte cette valeur juqu'au prochain temps défini dans la liste de l'attribut keyTimes.

Si le mode d'interpolation est "paced", l'attribut keyTimes est ignoré.

S'il y a une erreur dans la définition de l'attribut keyTimes (valeurs erronées, trop ou pas assez de valeurs), l'animation sera sans effet.

Si la durée simple n'est pas définie, toute définition de l'attribut keyTimes sera ignorée.

keySplines = "<liste>"

Un ensemble de points de contrôle de Bézier, associé à la liste de l'attribut keyTimes, qui définit une fonction de Bézier cubique contrôlant la cadence des intervalles. La valeur de l'attribut est une liste de descriptions de points de contrôle, séparées par des points-virgules. Chaque description de point de contrôle forme un ensemble de quatre valeurs en virgule flottante x1 y1 x2 y2, qui décrit les points de contrôle de Bézier d'un seul segment de temps. Les valeurs de l'attribut keyTimes définissant le segment associé sont les points d'ancre de Bézier et les valeurs de l'attribut keySplines sont les points de contrôle. Il doit donc y avoir un ensemble de points de contrôle de moins que de valeurs keyTimes.

Les valeurs doivent toutes se trouver dans un intervalle de 0 à 1.

Cet attribut est ignoré à moins que l'attribut calcMode n'ait la valeur "spline".

S'il y a une erreur dans la définition de l'attribut keySplines (valeurs erronées, trop ou pas assez de valeurs), l'animation sera sans effet.

Si l'attribut calcMode vaut "discrete", "linear" ou "spline", et que l'attribut keyTimes n'est pas défini, alors les valeurs de l'attribut values sont supposées réparties équitablement tout au long de la durée de l'animation conformément au mode indiqué par calcMode :

• Pour une animation "discrete", la durée est divisée en périodes de temps égales, une par valeur. La fonction d'animation prend les valeurs dans l'ordre, une valeur pour chaque période de temps ;
• Pour les animations "linear" et "spline", la durée est divisée en n-1 périodes égales et la fonction d'animation est une interpolation linéaire entre les valeurs aux temps associés. Remarquez qu'une animation "linear" fera sans problème une boucle sans fin si la première valeur est répétée comme étant la dernière.

La sémantique est la même si l'attribut keySplines est défini mais pas l'attribut keyTimes. Les temps associés aux valeurs de l'attribut keySplines sont déterminés comme décrit précédemment.

La syntaxe des jeux de points de contrôle dans les listes d'attributs keySplines est la suivante :

control-pt-set ::= ( fpval comma-wsp fpval comma-wsp fpval comma-wsp fpval )
fpval          ::= nombre en virgule flottante
comma-wsp      ::= S (spacechar|",") S

Les valeurs des points de contrôle sont séparées par au moins un caractère blanc ou une virgule. Les caractères blancs supplémentaires autour du séparateur sont permis. La syntaxe des nombres en virgule flottante doit être définie dans le langage hôte.

Pour les formes abrégées des animation from-to et animation from-by, il n'y a que deux valeurs. L'animation from-to de type "discrete" appliquera la valeur de l'attribut from pour la première moitié de la durée simple et la valeur de l'attribut to pour la seconde moitié. De façon similaire, l'animation from-by appliquera la valeur de l'attribut from pour la première moitié de la durée simple et, pour la seconde moitié, appliquera le résultat calculé d'après la valeur de l'attribut by. Pour la forme abrégée d'animation to, il n'y a qu'une seule valeur ; une animation to de type "discrete" appliquera simplement la valeur de l'attribut to pour la durée simple.

Si les valeurs d'arguments des attributs keyTimes ou keySplines ne sont pas légales (y compris pas assez ou trop de valeurs pour l'un ou l'autre attribut), l'animation sera sans effet (cf. également la section Le traitement des erreurs de syntaxe).

Dans les valeurs des attributs calcMode, keyTimes et keySplines, les caractères blancs de tête et de queue tout comme ceux avant et après les séparateurs points-virgules seront ignorés.

Les modes d'interpolation illustrés

Les trois illustrations 1a, 1b et 1c ci-dessous montrent comment la même animation de base va changer une valeur au cours du temps, en fonction des différents modes d'interpolation. Tous les exemples utilisent la temporisation par défaut (aucun attribut keyTimes ou keySplines n'est défini). Tous les exemples ont la trame suivante, sauf l'attribut calcMode qui prend juste des valeurs différentes :

<animate dur="30s" values="0; 1; 2; 4; 8; 15" calcMode="[comme indiqué]" />

	Figure 1a : Animation discrète par défaut. calcMode="discrete" Il y a six segments de durée égale : un segment par valeur.
	Figure 1b : Animation linéaire par défaut. calcMode="linear" Il y a cinq segments de durée égale : n-1 segments pour n valeurs. L'interpolation spline est une décomposition de la forme linéaire, et elle est illustrée plus loin dans la figure 2.
	Figure 1c : Animation régulée par défaut. calcMode="paced" Il y a cinq segments de durée variable : n-1 segments pour n valeurs, calculés pour produire un taux de variation constant dans la valeur.

Exemples

L'exemple suivant décrit une animation discrète simple :

<animate attributeName="foo" dur="8s" 
     values="bar; fun; far; boo" />

La valeur de l'attribut foo se fixera sur chacune des quatre chaînes, pendant deux secondes chacune. Puisque les valeurs de chaînes ne peuvent pas être interpolées, seule est possible une animation de type "discrete", et tout attribut calcMode serait ignoré.

On peut aussi utiliser une animation "discrete" avec l'attribut keyTimes, comme dans l'exemple suivant :

<animateColor attributeName="color" dur="10s" calcMode="discrete"
     values="green; yellow; red" keyTimes="0.0; 0.5;" />

Cet exemple montre aussi comment les valeurs d'attribut keyTimes peuvent interagir avec une durée indéfinie. La valeur de l'attribut color se fixera sur "green" pendant cinq secondes, puis sur "yellow" pendant cinq secondes et enfin sur "red" pour le restant du document, puisque la durée (non définie) vaut "indefinite" par défaut.

L'exemple suivant décrit une animation linéaire simple :

<animate attributeName="x" dur="10s" values="0; 10; 100" 
     calcMode="linear"/>

La valeur de l'attribut x changera de "0" à "10" au cours des cinq premières secondes, et de "10" à "100" au cours des cinq secondes suivantes. Remarquez que les valeurs dans l'attribut values sont espacées régulièrement dans le temps sans attribut keyTimes défini ; le résultat ici est une variation réelle de la valeur bien plus grande pendant la seconde moitié de l'animation. À comparer avec le même exemple utilisant cette fois une interpolation "paced" :

<animate attributeName="x" dur="10s" values="0; 10; 100" 
     calcMode="paced"/>

Pour produire un rythme de changement régulier de l'attribut x, le deuxième segment défini par la liste de l'attribut values reçoit la plus grande partie de la durée simple. La valeur de x changera de "0" à "10" au cours de la première seconde, puis de "10" à "100" au cours des neuf secondes suivantes. Quoiqu'on puisse aisément créer cet exemple comme une animation from-to sans interpolation régulière, beaucoup d'exemples (tels que les tracés de mouvement) sont plus difficiles à concevoir sans la valeur "paced" de l'attribut calcMode.

L'exemple suivant illustre l'utilisation de l'attribut keyTimes :

<animate attributeName="x" dur="10s" values="0; 50; 100" 
     keyTimes="0; .8; 1" calcMode="linear"/>

Les valeurs de l'attribut keyTimes font que l'attribut x a une valeur de "0" au début de l'animation, de "50" après huit secondes (à 80 % de la durée simple) et de "100" à la fin de l'animation. La valeur variera plus lentement dans la première moitié de l'animation et plus rapidement dans la seconde moitié.

En étendant cet exemple pour utiliser l'attribut keySplines :

<animate attributeName="x" dur="10s" values="0; 50; 100" 
     keyTimes="0; .8; 1" calcMode="spline" 
     keySplines=".5 0 .5 1; 0 0 1 1" />

L'attribut keyTimes fait que l'attribut x a toujours une valeur de "0" au début de l'animation, de "50" après huit secondes et de "100" à la fin de l'animation. Par contre, les valeurs de l'attribut keySplines définissent une courbe afin de réguler l'interpolation entre les valeurs. Dans l'exemple précédent, la spline produit un effet d'entrée et de sortie en douceur entre les temps 0 et 8 secondes (c'est-à-dire entre les valeurs d'attribut keyTimes "0" et ".8", et les valeurs de l'attribut values "0" et "50"), mais une interpolation linéaire stricte entre le temps 8 secondes et la fin (c'est-à-dire entre les valeurs d'attribut keyTimes ".8" et "1", et les valeurs de l'attribut values "50" et "100"). Cf. la figure 2 ci-dessous pour une illustration des courbes définies par ces valeurs d'attribut keySplines.

Pour certains attributs, les lecteurs ne discerneront peut-être pas aisément le rythme de changement. Par contre, pour les animations comme les mouvements, la possibilité de changer graduellement, et non pas de façon abrupte, la vitesse du mouvement peut être importante. L'attribut keySplines permet ce contrôle.

La figure suivante illustre l'interprétation de l'attribut keySplines. Chaque diagramme montre l'effet du paramétrage de keySplines sur un seul intervalle (c'est-à-dire entre les couples de valeurs associés dans les listes des attributs keyTimes et values). On peut assimiler l'axe horizontal à la valeur d'entrée de la progression unitaire de l'interpolation dans l'intervalle, c'est-à-dire le rythme auquel l'interpolation avance au long de l'intervalle en question. L'axe vertical représente la valeur résultante de la progresssion unitaire produite par la fonction keySplines. Décrit autrement, l'axe horizontal représente le temps unitaire en entrée de l'intervalle, et l'axe vertical le temps unitaire en sortie. Cf. également la section La temporisation et les temps d'horloge du monde réel.

	keySplines="0 0 1 1" (par défaut)		keySplines=".5 0 .5 1"
	keySplines="0 .75 .25 1"		keySplines="1 0 .25 .25"

Figure 2: Illustration de l'effet de l'attribut keySplines

Pour illuster les calculs, considérons l'exemple simple suivant :

<animate dur="4s" values="10; 20" keyTimes="0; 1"
     calcMode="spline" keySplines={selon le tableau} />

En utilisant les valeurs d'attribut keySplines pour chacun des quatre cas ci-dessus, les valeurs interpolées approximatives au fur et à mesure de l'animation sont les suivantes :

Cf. [COMP-GRAPHICS] pour la définition formelle du calcul d'une spline de Bézier.

On peut aussi utiliser les attributs keyTimes et keySplines avec les formes abrégées from/to/by pour la définition des valeurs, comme dans l'exemple suivant :

<animate attributeName="foo" from="10" to="20" 
     dur="10s" keyTimes="0.0; 0.7"
     calcMode="spline" keySplines=".5 0 .5 1" />

La valeur changera de "10" à "20", en utilisant la courbe entré/sortie en douceur définie par les valeurs d'attribut keySplines. Les valeurs keyTimes amèneront la valeur de "20" à sept secondes, où elle se tiendra pour le restant de la durée simple de dix secondes.

L'exemple suivant décrit une utilisation quelque peu inhabituelle : une animation from-to avec animation discrète. L'attribut stroke-linecap des éléments SVG prend une valeur de type chaîne, ce qui implique donc un mode d'interpolation "discrete". L'animation fixera la valeur de la propriété stroke-linecap à "round" pendant cinq secondes (la moitié de la durée simple), puis à "square" pendant cinq secondes.

<rect stroke-linecap="butt"...>
   <animate attributeName="stroke-linecap" 
      from="round" to="square" dur="10s"/>
</rect>

3.3. La définition de l'effet d'animation F(t)

Comme décrit précédemment, la fonction d'animation f(t) définition l'animation de la durée simple. Toutefois, la spécification SMIL Animation permet à l'auteur de répéter la durée simple. Elle permet aussi à l'auteur d'indiquer si l'animation devrait simplement s'arrêter lorsque la durée active se termine, ou si elle devrait être figée à la dernière valeur. En outre, l'auteur peut indiquer comment chaque animation devrait se combiner avec les autres animations et la valeur DOM originale.

Cette section décrit la syntaxe et la sémantique associée de cette fonctionnalité supplémentaire. On décrit un modèle détaillé de combinaison des animations avec des informations supplémentaires sur le modèle de temporisation.

La période de temps pendant laquelle l'animation est effectivement jouée, y compris les répétitions, est appelée la durée active. La durée active peut être calculée d'après la durée simple et la définition de répétition, et elle peut être contrainte par l'attribut end. Les règles de calcul complètes de la durée active sont présentées dans la section Le calcul de la durée active.

3.3.1. La répétition des animations

La répétition d'une animation entraîne la lecture plusieurs fois de suite de la fonction d'animation f(t). L'auteur peut indiquer combien de fois la répéter avec l'attribut repeatCount, ou bien combien de temps la répéter avec l'attribut repeatDur. Chaque itération de répétition est une instance de lecture de la fonction d'animation f(t).

Si la durée simple n'est pas définie, l'animation ne peut pas se répéter. Cf. également la section Le calcul de la durée active.

repeatCount

Indique le nombre d'itérations de la fonction d'animation. Cet attribut admet les valeurs suivantes :

une valeur numérique

Le nombre d'itérations est indiqué par une valeur numérique en virgule flottante (base 10). Elle peut inclure des itérations partielles exprimées en valeurs fractionnelles. Une valeur fractionnelle décrit une partie de la durée simple. La valeur doit être supérieure à 0.

"indefinite"

L'animation est définie pour se répéter indéfiniment (c'est-à-dire jusqu'à ce que le document se termine).

repeatDur

Indique la durée totale de la répétition. Cet attribut admet les valeurs suivantes :

Clock-value

Indique la durée dans le temps de présentation pendant laquelle répéter la fonction d'animation f(t).

"indefinite"

L'animation est définie pour se répéter indéfiniment (c'est-à-dire jusqu'à ce que le document se termine).

On devrait définir l'un des attributs repeatCount ou repeatDur au plus. Si les deux sont définis (et que la durée simple n'est pas "indefinite"), alors la durée active est définie comme le minimum entre la valeur de repeatDur et la durée simple multipliée par la valeur de repeatCount. Pour les besoins de cette comparaison, une valeur définie est censée être inférieure à la valeur "indefinite". Si la durée simple n'est pas définie et si les deux attributs repeatCount et repeatDur sont indiqués, l'attribut repeatCount sera ignoré et l'attribut repeatDur utilisé (cf. les exemples à suivre décrivant l'attribut repeatDur et une durée simple non définie). Ces règles sont incluses dans la section Le calcul de la durée active.

Exemples

Dans l'exemple suivant, la fonction d'animation de 2.5 secondes se répétera deux fois, et la durée active sera de 5 secondes.

<animate attributeName="top" from="0" to="10" dur="2.5s"
    repeatCount="2" />

Dans l'exemple suivant, la fonction d'animation se répétera deux fois entièrement, puis sa première moitié sera répétée une fois de plus, et la durée active sera de 7.5 secondes.

<animate attributeName="top" from="0" to="10" dur="3s"
    repeatCount="2.5" />

Dans l'exemple suivant, la fonction d'animation se répétera pendant un total de 7 secondes. Elle sera lue entièrement deux fois, et suivie par une partie fractionnaire de 2 secondes. Cela équivaut à une valeur de "2.8" pour l'attribut repeatCount. La dernière itération (partielle) appliquera des valeurs dans l'intervalle "0" à "8".

<animate attributeName="top" from="0" to="10" dur="2.5s"
    repeatDur="7s" />

Remarquez que si la durée simple n'est pas définie (par exemple, sa valeur est "indefinite), alors le comportement de répétition n'est pas défini (mais l'attribut repeatDur définit toujours la durée active). Dans l'exemple suivant, la durée simple n'est pas définie, et l'attribut repeatCount est effectivement ignoré. Néanmoins, cela ne constitue pas une erreur : la durée active est également indéfinie. L'effet de l'animation consiste juste à utiliser la valeur de f(0), en fixant la couleur de l'attribut fill à "red" pour le restant de la durée du document.

<animate attributeName="fill" from="red" to="blue"
    repeatCount="2" />

Dans l'exemple suivant, la durée simple n'est pas définie, mais l'attribut repeatDur détermine toujours la durée active. L'effet de l'animation consiste à fixer la couleur de l'attribut fill à "red" pendant 10 secondes.

<animate attributeName="fill" from="red" to="blue"
    repeatDur="10s" />

Dans l'exemple suivant, la durée simple est supérieure à la durée indiquée par l'attribut repeatDur, et la durée active raccourcira donc effectivement la durée simple. Toutefois, la fonction d'animation continue l'interpolation en utilisant la durée simple indiquée. L'effet de l'animation consiste à interpoler la valeur de l'attribut top de "10" à "17" au cours de 7 secondes.

<animate attributeName="top" from="10" to="20" 
    dur="10s" repeatDur="7s" />

L'attribut min et la relance

L'attribut min n'empêche pas la relance de l'élément avant que la durée active minimum ne soit atteinte.

Le contrôle du comportement d'une animation à répétition — L'animation cumulative

L'auteur peut aussi choisir qu'une animation à répétition devrait répéter le comportement original à chaque itération, ou bien qu'elle devrait ajouter au résultat précédent, accumulant à chaque itération. Par exemple, un tracé de mouvement décrivant un arc peut se répéter en se déplaçant sur le même arc, encore et encore, ou bien peut débuter chaque itération de répétition là où la dernière s'est arrêtée, en faisant rebondir l'élément animé à travers la fenêtre. On l'appelle une animation cumulative.

En utilisant la notation de tracé d'un arc simple (précisée dans la section L'élément animateMotion), on décrit cet exemple ainsi :

<img ...>
   <animateMotion path="m 0 0 c 30 50 70 50 100 0 z" dur="5s"
      accumulate="sum" repeatCount="4" />
</img>

L'image se déplace depuis la position originale le long de l'arc au cours de 5 secondes. Lorsque l'animation se répète, elle repart de la valeur précédente et commence le deuxième arc là où s'est achevé le premier, comme illustré dans la figure 3 ci-dessous. Ainsi, l'image rebondit à travers l'écran. On pourrait décrire la même animation par un tracé totalisant quatre arcs, mais dans le cas général la description des tracés peut devenir très volumineuse et malaisée à créer.

Figure 3 : Illustration d'une animation à répétition avec accumulate="sum". Chaque itération de répétition ajoute à la précédente.

Remarquez que l'animation cumulative contrôle seulement la façon dont une seule animation accumule les résultats de la fonction d'animation au fur et à mesure qu'elle se répète. Elle ne contrôle pas en particulier comme une animation interagit avec les autres animations pour produire une valeur de présentation. Ce dernier comportement est décrit dans la section L'animation additive.

Le comportement cumulatif des animations à répétition est contrôlé par l'attribut accumulate :

accumulate = "none | sum"

Contrôle si l'animation est cumulative ou non.
Pour la valeur "sum", chaque itération de répétition ajoute à la dernière valeur de l'itération précédente.
Pour la valeur "none", les itérations de répétition ne sont pas cumulatives et répètent simplement la fonction d'animation f(t). C'est la valeur par défaut.

Cet attribut est ignoré si l'attribut cible ne gère pas l'addition, ou si l'élément d'animation ne se répète pas.

L'animation cumulative n'est pas définie pour une animation to. Cet attribut sera ignoré si la fonction d'animation est seulement définie par l'attribut to. Cf. également la section Les valeurs de la fonction d'animation.

Tout attribut numérique gérant l'addition gère l'animation cumulative. Par exemple, on peut définir une animation palpitante qui augmentera de 100 pixels en 50 secondes l'attribut width d'un élément SVG rect.

<rect width="20px"...>
   <animate attributeName="width" dur="5s"
      values="0; 15; 10" additive="sum"
      accumulate="sum" repeatCount="10" />
</rect>

Chaque durée simple gonfle la largeur du rectangle de 15 pixels puis la dégonfle pour la laisser 10 pixels plus grande. La forme fait 20 pixels de large au début et 30 pixels après 5 secondes. L'animation se répète et ajoute aux valeurs précédentes. La forme gonflera à 45 pixels pour revenir à 40 pixels après 10 secondes, et finira éventuellement à 120 pixels (20+120) de large au bout de toutes les dix répétitions.

Les animations from-to et from-by gèrent également l'animation cumulative, comme dans l'exemple suivant :

<rect width="20px"...>
   <animate attributeName="width" dur="5s" from="10px" to="20px"
      accumulate="sum" repeatCount="10" />
</rect>

Le rectangle grandira de 10 à 20 pixels au cours des cinq premières secondes, puis de 20 à 30 pixels, au cours des cinq suivantes, et ainsi de suite jusqu'à 110 pixels au terme des dix répétitions. Remarquez, comme la valeur par défaut de l'attribut additive est "replace", que la valeur originale est ignorée. L'exemple suivant rend l'animation explicitement additive :

<rect width="20px"...>
   <animate attributeName="width" dur="5s" from="10px" to="20px"
      accumulate="sum" additive="sum" repeatCount="10" />
</rect>

Les résultats sont les mêmes que précédemment, à la différence que toutes les valeurs se sont déplacées vers le haut depuis la valeur originale de "20px". Le rectangle fait 30 pixels de large après cinq secondes et 130 pixels au terme des dix répétitions.

Le calcul des valeurs de l'animation cumulative

Pour produire le comportement d'animation cumulative, on doit modifier légèrement la fonction d'animation f(t). Chaque itération après la première doit ajouter la dernière valeur de l'itération précédente (on l'exprime comme un multiple de la dernière valeur indiquée pour la fonction d'animation. Remarquez que l'animation cumulative est définie en fonction des valeurs indiquées du comportement d'animation, et non en fonction des valeurs d'animation échantillonnées ou rendues. Les dernières varieraient d'une machine à l'autre, et même pourraient varier entre les vues de documents sur la même machine.

Soit fi(t), représentant la fonction d'animation cumulative d'une itération i donnée.

La première itération f0(t), non affectée par l'attribut accumulate, est donc la même que la définition de la fonction d'animation originale.

f0(t) = f(t)

Soit ve la dernière valeur définie pour la fonction d'animation (par exemple, la valeur de l'attribut to, la dernière valeur d'une liste values ou la valeur finale d'un attribut path). Chaque itération après la première ajoute le décalage calculé :

fi(t) = (ve * i) + f(t) ; i >= 1

3.3.2. Le contrôle de la durée active

La spécification SMIL Animation fournit un contrôle supplémentaire de la durée active. L'attribut end permet à l'auteur de contraindre la durée active de l'animation en indiquant une valeur de fin, avec un décalage simple, une base de temps, une base d'événement ou l'appel de méthodes DOM. L'attribut end peut contraindre mais pas étendre la durée active définie par ailleurs par un attribut dur et un comportement de répétition éventuel. Les règles de combinaison des attributs pour le calcul de la durée active sont présentées dans la section Le calcul de la durée active.

end

Définit une valeur de fin de l'animation qui peut contraindre la durée active.
La valeur de l'attribut se compose d'une liste de valeurs, séparées par des points-virgules.

end-value-list : end-value (";" end-value-list )?

Une liste de valeurs de fin, séparées par des points-virgules. L'interprétation d'une liste de valeurs de fin est précisée dans la section L'évaluation des listes de temps de début et de fin.

end-value : ( offset-value | syncbase-value | event-value | repeat-value | accessKey-value | media-marker-value | wallclock-sync-value | "indefinite" )

Décrit la valeur de fin.

offset-value : ( "+" | "-" )? Clock-value

Indique le temps de présentation de la fin. La valeur de fin est donc définie relativement au début du document.

syncbase-value : ( Id-value "." ( "begin" | "end" ) ) ( ( "+" | "-" ) Clock-value )?

Décrit une base de synchronisation et un décalage par rapport à cette base de synchronisation. La valeur de fin est définie relativement au début ou à la fin active d'un autre élément.

event-value : ( Id-value "." )? ( event-ref ) ( ( "+" | "-" ) Clock-value )?

Décrit un événement et un décalage optionnel qui déterminent le début de l'élément. La valeur de fin de l'animation est définie par rapport au temps où l'événement est suscité. Les événements peuvent être tous ceux définis pour le langage hôte, conformément à [DOM2Events]. Ils peuvent comprendre les événements de l'interface utilisateur, les déclencheurs d'événements transmis via un réseau, etc. Les détails de la temporisation basée sur les événements sont décrits dans la section L'unification de la temporisation interactive et de la temporisation programmée ci-dessous.

repeat-value : ( Id-value "." )? "repeat(" integer ")" ( ( "+" | "-" ) Clock-value )?

Décrit un événement de répétition qualifié. La valeur de fin est définie par rapport au temps où l'événement de répétition est suscité avec la valeur d'itération spécifiée.

accessKey-value : "accessKey(" character ")"

Décrit une clé d'accès qui détermine la valeur de fin. La valeur de fin est définie par rapport au temps où le caractère de clé d'accès est saisi par l'utilisateur.

wallclock-sync-value : "wallclock(" wallclock-value ")"

Décrit la valeur de fin comme un temps d'horloge du monde réel. La syntaxe du temps d'horloge est basée sur celle définie dans [ISO8601].

"indefinite"

La valeur de fin de l'animation sera déterminée par un appel de la méthode endElement() (ou un équivalent).
Les méthodes DOM de SMIL Animation sont décrites dans la section Les interfaces prises en charge.
La temporisation basée sur les hyperliens est décrite dans la section Les hyperliens et la temporisation.

La valeur de l'attribut end peut définir une liste de temps. On peut la mettre à profit pour indiquer plusieurs façons ou règles de terminer un élément, par exemple, si l'un de plusieurs événements a lieu. Une liste de temps peut également définir plusieurs temps de fin pouvant correspondre à plusieurs temps de début, permettant une lecture à plusieurs reprises de l'élément (ce comportement est contrôlable, cf. également la section La relance des animations).

Exemples

Dans l'exemple suivant, la durée active se terminera au premier arrivé entre les dix secondes et la fin de l'élément foo. Cela est particulièrement utile si foo est défini pour débuter ou finir relativement à un événement.

<animate dur="2s" repeatDur="10s" end="foo.end" ... />

Dans l'exemple suivant, l'animation débute lorsque l'utilisateur clique sur l'élément cible. La durée active s'achèvera 30 secondes après que le document a commencé. Remarquez que, si l'utilisateur n'a pas cliqué sur l'élément cible avant l'écoulement des 30 secondes, alors l'animation ne débutera jamais.

<animate begin="click" dur="2s" repeatDur="indefinite"
         end="30s" ... />

L'utilisation de l'attribut end avec une valeur d'événement permet aux auteurs de terminer une animation en fonction soit d'un événement interactif, soit d'une durée active maximum. On l'appelle parfois une interaction paresseuse.

Dans cet exemple, une présentation décrit un processus de montage. Elle utilise une animation pour déplacer une image alentour (par exemple, contre un arrière-plan), pour montrer comment un objet se déplace d'une partie d'un montage à l'autre. Chaque étape est un tracé de mouvement réglé pour se répéter trois fois pour illustrer clairement le point. Chaque animation peut également être arrêtée en cliquant sur un élément next, ce qui permet à l'utilisateur d'avancer la présentation à l'étape suivante.

<img id="objectToMove" ... >
  <animateMotion id="step1" begin="0" dur="5s"
     repeatCount="3" end="next.click" path.../>
  <animateMotion id="step2" begin="step1.end" dur="5s"
     repeatCount="3" end="next.click" path.../>
  <animateMotion id="step3" begin="step2.end" dur="5s"
     repeatCount="3" end="next.click" path.../>
  <animateMotion id="step4" begin="step3.end" dur="5s"
     repeatCount="3" end="next.click" path.../>
  <animateMotion id="step5" begin="step4.end" dur="5s"
     repeatCount="3" end="next.click" path.../>
</img>

Ici la fin active de chaque animation est définie comme le premier arrivé entre les 15 secondes après son début et un clic sur next. Le spectateur a le choix entre s'installer confortablement et regarder la présentation, ou la faire défiler plus vite.

3.3.3. Les attributs min et max : encore plus de contrôle sur la durée active

Cette section est informative

Les attributs min et max permettent à l'auteur de contrôler la limite inférieure et la limite supérieure de la durée active de l'élément.

Cette section est normative

S'il y a une erreur dans la syntaxe de la valeur d'argument de min, l'attribut sera ignoré (comme s'il n'avait pas été défini).

La valeur par défaut de l'attribut min est "0". Elle ne contraint pas du tout la durée active.

S'il y a une erreur dans la syntaxe de la valeur d'argument de max, l'attribut sera ignoré (comme s'il n'avait pas été défini).

La valeur par défaut de l'attribut max est "indefinite". Elle ne contraint pas du tout la durée active.

Si la valeur d'argument "media" est indiquée pour l'un des attributs min ou max sur un élément ne définissant pas de média, alors l'attribut concerné sera ignoré (comme s'il n'avait pas été défini).

Si les deux attributs min et max sont définis, alors la valeur de l'attribut max doit être supérieure ou égale à celle de l'attribut min. Si cette condition n'est pas remplie, les deux attributs sont ignorés.

La règle à suivre pour calculer la durée active lorsque les attributs min ou max sont définis est la suivante. À chaque calcul de la durée active d'un élément (c'est-à-dire pour chaque intervalle de l'élément s'il débute plusieurs fois), le calcul a lieu sans tenir compte des attributs min et max (en appliquant l'algorithme décrit dans la section Le calcul de la durée active). Le résultat obtenu à la suite de cette étape est comparé aux limites indiquées par les attributs min et max. Si le résultat se situe entre ces limites, alors la première valeur calculée est correcte. Sinon deux cas peuvent se produire :

• Si la première durée calculée est supérieure à la valeur maximale, alors la durée active de l'élément est définie comme étant égale à la valeur de l'attribut max (cf. le premier exemple ci-dessous).

• Si la première durée calculée est inférieure à la valeur de l'attribut min, alors la durée active de l'élément devient égale à la valeur de l'attribut min et le comportement de l'élément est le suivant :

  • Si la durée à répétition (ou la durée simple si l'élément ne se répète pas) de l'élément est supérieure à la valeur de l'attribut min, alors l'élément est lu normalement pour la durée active (contrainte par l'attribut min), cf. le deuxième et le troisième exemples ci-dessous.

  • Sinon l'élément est lu normalement pour sa durée à répétition (ou sa durée simple, si l'élément ne se répète pas), ensuite est figé ou non affiché selon la valeur de l'attribut fill, cf. le quatrième et le cinquième exemples ci-dessous.

L'attribut min et les temps de début négatifs

Si un élément est défini pour débuter avant son parent (par exemple, avec une valeur de décalage négative simple), la durée de l'attribut min est mesuré depuis le temps de début calculé, et non depuis le début observé (cf. l'exemple 1 ci-dessous). La valeur de l'attribut min peut donc n'avoir aucun effet.

Cf. également la section L'attribut min et la relance.

3.3.4. Le calcul de la durée active

Le tableau de la figure 4 présente la sémantique de toutes les combinaisons de durée simple possibles avec les attributs repeatCount et repeatDur, et l'attribut end. Les conventions utilisées dans le tableau sont les suivantes :

• Si une cellule est vide, elle indique que l'attribut associé est omis dans la syntaxe ;
• Si l'entrée du tableau est définie, elle correspond à une valeur définie explicite autre que la valeur "indefinite". Remarquez que, si la durée simple n'est pas définie, alors elle est définie comme valant "indefinite" ;
• Si l'entrée est représentée par une astérisque (*), la valeur est sans importance et peut représenter n'importe quelle possibilité.

En outre, on doit suivre les règles suivantes pour le calcul des valeurs :

• Si la durée active est définie comme le minimum d'entre plusieurs valeurs (MIN), il n'est pas toujours possible de le calculer lorsque le document débute. Si l'attribut end est lié à un événement ou au DOM, alors l'événement ou l'appel de méthode qui actionneraient l'attribut end avant la durée indiquée par l'attribut dur, et/ou l'attribut repeatCount ou l'attribut repeatDur, raccourciront la durée active au temps d'activation de end ;
• Si la valeur de l'attribut end ne peut pas être résolue (par exemple, si elle est liée à un événement), alors la valeur est considérée valoir "indefinite" pour les besoins d'évaluation de la durée active. Si la valeur de fin est résolue et à ce moment, la durée active est réévaluée.

Les règles et résultats implicites dans le tableau à noter en particulier sont les suivants :

• Si l'attribut end est indiqué, mais pas l'attribut repeatCount ni l'attribut repeatDur, alors la durée active est définie être le minimum d'entre la durée simple et la durée définie par l'attribut end ;
• Si l'attribut end et l'un des attributs repeatCount ou repeatDur (ou les deux) sont indiqués, alors la durée active est la durée minimum définie par les attributs respectifs ;
• Il est possible d'avoir une durée simple indéfinie et une durée active finie définie. La durée active peut contraindre (raccourcir) la durée simple, mais la durée active ne définit pas la durée simple ni change sa valeur (c'est-à-dire que la durée simple est toujours indéfinie lorsqu'elle est utilisée dans la fonction d'animation simple) ;
• Quelle que soient la durée active et la durée simple, toutes deux définies, le nombre de répétition est défini par la durée active divisée par la durée simple (ce qui peut produire des itérations de répétition fractionnaires, comme peut le faire l'attribut repeatCount).

Le tableau utilise les symboles suivants :

B

Le début d'une animation.

d

La durée simple d'une animation.

Figure 4 : Calcul de la durée active de différentes combinaisons de durée simple, d'attributs repeatCount et repeatDur, et d'attribut end

3.3.5. Le figeage des animations

Par défaut, lorsque un élément d'animation se termine, son effet n'est plus appliqué à la valeur de présentation de l'attribut cible. Par exemple, si une animation déplace une image et qu'elle se termine, l'image rebondira en arrière à sa position originale.

<img top="3" ...>
   <animate begin="5s" dur="10s" attributeName="top" by="100"/>
</img>

L'image sera immobile à top valant "3" pendant cinq secondes puis elle se déplacera de 100 pixels vers le bas en 10 secondes. L'animation s'achèvera quinze secondes après le début du document, l'effet n'étant plus appliqué, l'image bondira en arrière de "103" à "3" d'où elle a démarré (c'est-à-dire la valeur sous-jacente de l'attribut top).

On peut utiliser l'attribut fill pour conserver la valeur de l'animation après que la durée active de l'animation est terminée :

<img top="3" ...>
   <animate begin= "5s" dur="10s" attributeName="top" by="100"
          fill="freeze" />
</img>

L'animation se termine 15 secondes après le début du document mais l'image reste à top valant "103". L'attribut gèle la dernière valeur de l'animation pour le restant de la durée du document.

Le comportement de figeage d'une animation est contrôlé par l'attribut fill :

fill = "freeze | remove"

Cet attribut admet les valeurs suivantes :

"freeze"

L'effet d'animation F(t) est défini pour figer la valeur d'effet à la dernière valeur de la durée active. L'effet d'animation est figé pour le restant de la durée du document (ou jusqu'à ce que l'animation soit relancée, cf. la section La relance des animations).

"remove"

L'effet d'animation est supprimé (il n'est plus appliqué) lorsque la durée active de l'animation est terminée. Après la fin active de l'animation, l'animation n'affecte plus la cible (à moins que l'animation ne soit relancée, cf. la section La relance des animations).
C'est la valeur par défaut.

Si la durée active raccourcit la durée simple (y compris les cas à répétition partielle), la valeur d'effet d'une animation figée est définie par cette durée simple raccourcie. Dans l'exemple suivant, la fonction d'animation se répéte deux fois entièrement et encore une fois de la moitié de la durée simple. Auquel cas, la valeur figée sera de "15" :

<animate from="10" to="20" dur="4s" 
         repeatCount="2.5" fill="freeze" .../>

Dans l'exemple suivant, l'attribut dur est absent, et la durée simple n'est donc pas définie. La durée active est contrainte par l'attribut end pour être de 10 secondes. Puisque l'interpolation n'est pas définie, la valeur figée sera de "10" :

<animate from="10" to="20" end="10s" fill="freeze" .../> 

La comparaison avec la temporisation SMIL

La spécification SMIL Animation indique que fill="freeze" est en vigueur pour le restant du document, ou jusqu'à la relance de l'élément. Dans le modèle de temporisation plus général de SMIL, avec des conteneurs de temps, la durée de l'effet de figeage est contrôlée par le conteneur de temps, et ne s'étend jamais au-delà de la fin de la durée simple du conteneur de temps. Quoique cela puisse sembler contradictoire, la définition SMIL Animation de fill="freeze" est cohérente avec le modèle de temporisation SMIL. Dans SMIL Animation, le document représente tout simplement le seul conteneur de temps, et l'effet est donc celui décrit précédemment.

3.3.6. L'animation additive

Il est souvent pratique de définir une animation comme un décalage ou delta par rapport à la valeur d'un attribut plutôt qu'avec des valeurs absolues. Une simple animation d'agrandissement peut augmenter la largeur d'un objet de 10 pixels :

<rect width="20px" ...>
   <animate attributeName="width" from="0px" to="10px" dur="10s"
      additive="sum"/>
</rect>

La largeur commence à 20 pixels et augmente jusqu'à 30 pixels au cours de 10 secondes. Si l'animation était déclarée non additive, les mêmes valeurs from et to donneraient une largeur allant de 0 à 10 pixels pendant les 10 secondes.

En outre, beaucoup d'animations complexes s'expriment mieux comme des combinaisons d'animations simples. Par exemple, on peut décrire un tracé vibrant comme un mouvement répétitif de haut en bas associé à un autre mouvement :

<img ...>
   <animateMotion from="0,0" to="100,0" dur="10s" />
   <animateMotion values="0,0; 0,5; 0,0" dur="1s"
                  repeatDur="10s" additive="sum"/>
</img>

Lorsque plusieurs animations définies pour un attribut donné se chevauchent à un moment, elles se combinent, ou bien l'une prend le pas sur l'autre. Les animations se chevauchent lorsqu'elles sont actives ou bien figées au même moment. L'ordre des animations (par exemple, quelle animation remplace telle autre) est déterminé par une priorité associée à chaque animation. La priorité des animations dépend du moment où chacune débute. La première animation à débuter a la priorité la plus faible et la dernière la priorité la plus élevée.

Les animations de priorité supérieure non additives remplaceront toutes les animations antérieures (de priorité moindre) et fixeront simplement la valeur de l'attribut. Les animations additives s'appliquent (c'est-à-dire ajoutent) au résultat des animations activées avant. Cf. la section Le modèle d'animation en sandwich pour des précisions sur la combinaison des animations.

Le comportement additif d'une animation est contrôlé par l'attribut additive :

additive = "replace | sum"

Contrôle si l'animation est additive ou non.

"sum"

Indique que l'animation ajoutera à la valeur sous-jacente de l'attribut et des autres animations de priorité inférieure.

"replace"

Indique que l'animation remplacera la valeur sous-jacente de l'attribut et des autres animations de priorité inférieure. C'est la valeur par défaut. Toutefois, le comportement est également affecté par les valeurs des attributs by et to de l'animation, comme décrit ci-dessous.

L'animation additive est définie pour les attributs numériques et les autres types de données pour lesquels une fonction d'addition est définie. Cela comprend les attributs numériques de concepts comme la position, les largeurs, les hauteurs, les dimensions, etc. Cela inclut aussi la couleur (cf. la section L'élément animateColor) et peut inclure d'autres types de données comme défini par le langage hôte.

Il est souvent pratique de combiner des animations additives et le comportement de l'attribut fill, par exemple lorsqu'on définit une série de mouvements qui devraient ajouter à un autre :

<img ...>
   <animateMotion begin="0" dur="5s" path="[un tracé]"
           additive="sum" fill="freeze" />
   <animateMotion begin="5s" dur="5s" path="[un tracé]"
           additive="sum" fill="freeze" />
   <animateMotion begin="10s" dur="