From 063e35eea0756d210c9dae72960351f16c42573c Mon Sep 17 00:00:00 2001 From: "Maxime Chupin (escudo)" Date: Sun, 13 Nov 2016 16:10:56 +0100 Subject: [PATCH] Doc: Installation, Warning, Principe, Famille d'images --- doc/page.html | 31 +++++++++++++++++++++++++++++-- doc/page.md | 50 ++++++++++++++++++++++++++++++++++++++++++++------ 2 files changed, 73 insertions(+), 8 deletions(-) diff --git a/doc/page.html b/doc/page.html index e1a31c3..eb62d50 100644 --- a/doc/page.html +++ b/doc/page.html @@ -12,12 +12,34 @@

Participants : Chupin Maxime, Sarlat Jean-Michel.

Interface du dépôt Git : http://melusine.eu.org/syracuse/G/git/?p=svganimation.git;a=summary

L'objectif est de développer, en particulier, du code Javascript afin de présenter des animations de fichiers SVG produits, en particulier, par MetaPost. Ce développement n'étant pas tout à fait prédéterminé, il sera constitué à partir de l'exploration de différents scénarios de présentation de ces animations et des modes de construction des fichiers SVG.

+
+

+Les différents exemples se charge en cliquant sur le bouton dédié. Ceci n'est pas le comportement par défaut. Il s'agit d'éviter de charger toutes les animations présentes sur cette page, cela serait bien trop lourd. +

+

+Nous présentons, dans la section XX, le code qui permet de charger l'animation sur demande. +

+

Installation

-

Le fichier SVGAnimation.js (que l'on supposera dans le répertoire js) est à charger dans la page html en mettant les lignes suivantes :

+

Le fichier SVGAnimation.js (que l'on supposera dans un répertoire nommé js) est à charger dans la page html en mettant les lignes suivantes :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 <script type="text/javascript" src="js/SVGAnimation.js"></script>
-

La librairie SVGAnimation.js dépend de JQuery, il faut donc charger charger cette bibliothèque JavaScript avant.

+

La librairie SVGAnimation.js dépend de JQuery, il faut donc charger cette bibliothèque JavaScript avant.

+

Principe

+

Le principe est simple : on dispose d'un ensemble d'images au format SVG qui constituent, par une suite chronologique, une animation à visionner. La libraire SVGAnimation permet de visionner cette animation dans une page HTML.

+

La famille d'images

+

Les différentes images composant l'animation doivent se nommer avec un prefixe suivit d'un tiret puis d'un nombre (celui-ci pouvant être formater de différente façons).

+
monfichier-1.svg  monfichier-2.svg monfichier-3.svg ...
+

ou

+
monfichier-001.svg  monfichier-002.svg monfichier-003.svg ...
+

Nous verrons comment gérer le formatage de l'indice des images dans les sections suivantes.

+
+

+L'idée d'une telle librairie est venue du fait que le logiciel MetaPost permet de produire des images SVG, et nous l'utilisons abondamment pour la production d'animations. +

+

L'objet Animation

+

La librairie SVGAnimation définit le prototype javascript Animation. Pour l'utiliser il faut déclarer

animation1
@@ -29,6 +51,7 @@ Charger l'animation
+

L'utilisation

Les paramètres

Les players

SVGPlayerOne.js

@@ -40,7 +63,11 @@ Charger l'animation