6-7 Mai 2002STAF2x Grassioulet et Nova1 Scalable Vector Graphics Outils, ressources, logiques...

of 73 /73
6-7 Mai 2002 STAF2x Grassioulet et Nov a 1 Scalable Vector Graphics Outils, ressources, logiques d’utilisation, syntaxe et génération (php, xml)

Embed Size (px)

Transcript of 6-7 Mai 2002STAF2x Grassioulet et Nova1 Scalable Vector Graphics Outils, ressources, logiques...

  • Page 1
  • 6-7 Mai 2002STAF2x Grassioulet et Nova1 Scalable Vector Graphics Outils, ressources, logiques dutilisation, syntaxe et gnration (php, xml)
  • Page 2
  • 6-7 Mai 2002STAF2x Grassioulet et Nova2 Sommaire Objectifs Intro Outils et ressources Template SVG Logique SVG Syntaxe de base Animations Gnrer du SVG avec SVG et XSLT
  • Page 3
  • 6-7 Mai 2002STAF2x Grassioulet et Nova3 Objectifs Vous montrer comment SVG marche Prsentation grossire de la syntaxe Dfricher le terrain Vous montrer ou chercher de quoi vous dbrouillez
  • Page 4
  • 6-7 Mai 2002STAF2x Grassioulet et Nova4 Introduction La ncessit d'avoir des graphiques vectoriels et retaillables a conduit le W3 Consortium a l'laboration de la spcification SVG. SVG est un langage de description de graphiques 2D en XML. Les objets graphiques peuvent tre groups, transforms, composs dans d'autres objets et recevoir des attributs de style. Les graphiques SVG sont interactifs et dynamiques. Leur animation peut tre dfinie soit l'intrieur des fichiers SVG soit dans un langage de script externe. On peut ainsi insrer SVG dans du HTML, XHTML, le gnrer partir de XSLT ou de php, utiliser css et le scripter avec javascript (via DOM).
  • Page 5
  • 6-7 Mai 2002STAF2x Grassioulet et Nova5 Introduction(2) Scalable = zoomable et permet un grand nombre d'utilisateurs et un grand nombre d'utilisations ( par r-utilisation de fragments ) XML : possibilit d'utiliser tous les outils XML : parser, outil de transformation, base de donnes. La conformit aux espaces de nommage permet de mlanger des grammaires XML entre elles ; par exemple, un document HTML peut contenir des graphiques SVG, des expressions mathmatiques en MathML, des prsentations en SMIL,...
  • Page 6
  • 6-7 Mai 2002STAF2x Grassioulet et Nova6 Outils SVG On peut valider le code on-line : http://validator.w3.org http://validator.w3.org Il commence y avoir des viewers. Le plus simple est le plug-in Adobe : http://www.adobe.com/svg/ (marche avec IE 5/6, NS 4.x et Mozilla < 0.9.0). Click droit pour voir source (menu)http://www.adobe.com/svg/ Il existe des diteurs, le plus courant tant Webdraw (de Jasc) : http://www.jasc.com ou XMLwriter : http://www.xmlwriter.com ou Mayura Draw : http://www.mayura.comhttp://www.jasc.com http://www.xmlwriter.com
  • Page 7
  • 6-7 Mai 2002STAF2x Grassioulet et Nova7 Ressources Spcifications : http://www.w3.org/TR/SVG/http://www.w3.org/TR/SVG/ Tutorials : http://www.adobe.com/svg/tutorial/intro.html http://www.adobe.com/svg/tutorial/intro.html http://www.xml.com/pub/a/2001/03/21/svg.html http://www.euroclid.fr/Cours_SVG/plan.htm http://www.euroclid.fr/Cours_SVG/plan.htm (franais) SVG reference with examples : http://www.zvon.org/xxl/svgReference/Output/index. html http://www.zvon.org/xxl/svgReference/Output/index. html
  • Page 8
  • 6-7 Mai 2002STAF2x Grassioulet et Nova8 Template SVG de base (1)
  • Page 9
  • 6-7 Mai 2002STAF2x Grassioulet et Nova9 Template SVG de base (2) : dclaration XML standard : indication du DTD pour un document non standalone : dclaration du namespace et des dimensions du document SVG. On est ici la racine du contenu SVG.
  • Page 10
  • 6-7 Mai 2002STAF2x Grassioulet et Nova10 Exemple simple Hello world ! Exemple 1 X et y : position stroke, dfinit comment le bord d'un objet est paint fill, dfinit comment le contenu d'un objet est paint
  • Page 11
  • 6-7 Mai 2002STAF2x Grassioulet et Nova11 Styles On peut appliquer deux syntaxes diffrentes de mise en forme : soit par CSS2 (Cascading Style Sheet Level 2 ) : l'attribut style reprend la syntaxe et les styles de CSS2 soit par XSL (XML Style Language) soit par l'attribut style commun beaucoup de balises SVG Il est recommand de ne pas mlanger les styles CSS et XSL dans le mme document SVG
  • Page 12
  • 6-7 Mai 2002STAF2x Grassioulet et Nova12 Mise en forme diffrente Exemple dattributs de prsentation SVG, les deux ont le mme effet : SVG CSS2
  • Page 13
  • 6-7 Mai 2002STAF2x Grassioulet et Nova13 Types des donnes de base Angle : un entier suivi de deg ( degrs ), grad ( grades ), rad ( radians ) Couleur : spcifi dans le modle sRGB ; spcification d'une couleur RGB comme en HTML : #rrggbb ou un mot-cl dans la liste : aqua, black, fuchsia, gray, green,l ime, maroon, navy, olive, purple, red, silver, teal, white, yellow Entier : entre - 2147483648 et 2147483647 Rel : soit en notation dcimale soit en notation scientifique ( x.yyye(ou E)nn ) entre - 3.4e+38 et 3.4e+38 Longueur : nombre suivi d'un identifiant CSS (mm,cm,m) Temps : nombre suivi de ms ou de s. URI : Uniform Ressource Identifier
  • Page 14
  • 6-7 Mai 2002STAF2x Grassioulet et Nova14 Logique SVG : structure Un document SVG se compose d'un ou plusieurs fragments dlimits par la balise Il peut y avoir plusieurs structures embotes dans le mme document ou dans des documents composites rsultants de plusieurs espaces de noms La balise dfinit l'espace utilisateur Attributs de la balise x = "x0" ; position en x du coin suprieur gauche ( pour les structures internes ) y = "y0" ; position en y du coin suprieur gauche ( pour les structures internes ) width = "w0" ; largeur en pixels de l'espace ( pour les structures externes ) height = "h0" ; hauteur en pixels de l'espace ( pour les structures externes )
  • Page 15
  • 6-7 Mai 2002STAF2x Grassioulet et Nova15 Logique SVG :mcanismes Positionnement : les objets SVG se positionnent dans un systme de coordonnes qui commence en haut et gauche. Il est possible de travailler avec des coordonnes locales Attributs : la plupart des lments se partagent un nombre commun d'attributs comme par exemple l'attribut "id" (identificateur) ou encore "style" (styles CSS2) La plupart des valeurs d'attributs sont assez intuitives (proche de CSS). Transformations : les objets peut tre translat, orient et chang de taille. Il hrite des transformations de l'objet parent,
  • Page 16
  • 6-7 Mai 2002STAF2x Grassioulet et Nova16 Formes de base SVG On va pas tout vous montrer :) Elments de base : rectangle, cercel, lignes/poly- lignes, polygones et formes arbitraires Les formes prdfinies (chemins particuliers) permettent de s'affranchir de la description complte d'un chemin (path)
  • Page 17
  • 6-7 Mai 2002STAF2x Grassioulet et Nova17 Rectangles x : coordonne x du cot du rectangle de plus bas x y : coordonne y du cot du rectangle de plus bas y Par dfaut x et y = 0 width : largeur du rectangle height : hauteur du rectangle rx : pour des rectangles coins arrondis rayon en x de l'ellipse assurant le raccord rx : pour des rectangles coins arrondis rayon en y de l'ellipse assurant le raccord
  • Page 18 cx : coordonne x du centre de l'ellipse 0 par dfaut cy : coordonne y du centre de l'elipse 0 par dfaut rx : rayon de l'ellipse suivant l'axe des x ry : rayon de l'ellipse suivant l'axe des y">
  • 6-7 Mai 2002STAF2x Grassioulet et Nova18 Cercles et ellipses cx : coordonne x du centre du cercle 0 par dfaut cy : coordonne y du centre du cercle 0 par dfaut r : rayon du cercle ellipse cx="coord" cy="coord" rx="longueur" ry="longueur" /> cx : coordonne x du centre de l'ellipse 0 par dfaut cy : coordonne y du centre de l'elipse 0 par dfaut rx : rayon de l'ellipse suivant l'axe des x ry : rayon de l'ellipse suivant l'axe des y
  • Page 19
  • 6-7 Mai 2002STAF2x Grassioulet et Nova19 Les lignes x1 : coordonne x du point de dpart y1 : coordonne y du point de dpart x2 : coordonne x du point d'arrive y2 : coordonne y du point d'arrive
  • Page 20
  • 6-7 Mai 2002STAF2x Grassioulet et Nova20 Polyligne Une polyligne est un ensemble de lignes droites connectes entre elles Une polyligne dfinit une forme ouverte liste de points est une liste de coordonnes x, y spares par des virgules Ces coordonnes sont exprimes dans l'espace utilisateur Exemple de polyligne
  • Page 21
  • 6-7 Mai 2002STAF2x Grassioulet et Nova21 Polygones Un polygone est un ensemble de lignes droites connectes entre elles dfinissant une forme ferme liste de points est une liste de coordonnes x, y spares par des virgules Ces coordonnes sont exprimes dans l'espace utilisateur Exemple de polygone
  • Page 22
  • 6-7 Mai 2002STAF2x Grassioulet et Nova22 Formes arbitraires L'lment permet de dfinir des formes arbitraires pouvant avoir un contour (stroke). Exemple simple :Exemple simple Voir les spcifications pour plus de prcisions En gros, il y a des commandes comme M (moveto) qui permettent de dplacer le crayon qui dessine ou Z qui peuvent fermer les chemins.
  • Page 23
  • 6-7 Mai 2002STAF2x Grassioulet et Nova23 Texte (1) Le texte suit les recommandations gnrales des caractres XML (attention au codage des accents !) Il n'effectue ni retour la ligne ni csure automatique La balise est traite comme un objet graphique. En tant que telle, elle subit l'influence : des changements de coordonnes du mode de rendu du clipping
  • Page 24
  • 6-7 Mai 2002STAF2x Grassioulet et Nova24 Texte (2) : syntaxe blabli x reprsente l'abscisse de dpart du texte s'il n'est pas suivi d'unit, la valeur est calcule dans l'espace utilisateur s'il est suivi d'une unit CSS ou de %, la valeur est calcule par rapport au point de vue y reprsente l'ordonne de dpart du texte si elle n'est pas suivie d'unit, la valeur est calcule dans l'espace utilisateur si elle est suivie d'une unit CSS ou de %, la valeur est calcule par rapport au point de vue
  • Page 25
  • 6-7 Mai 2002STAF2x Grassioulet et Nova25 Texte (3) : lments d'ajustement et attributs A l'intrieur d'un lment, on peut ajuster la position du texte, la valeur du texte ou la police du texte grace l'lment Par l'intermdiaire d'attributs de type CSS, on peut spcifier : la mise en page du texte : largeur des caractres, taille des caractres le sens d'criture : de gauche droite, de haut en bas,... l'alignement du texte l'espacement, le retour la ligne la dcoration
  • Page 26
  • 6-7 Mai 2002STAF2x Grassioulet et Nova26 Le texte (4) : lien avec les chemins On peut imposer au texte de suivre un chemin prdfini par la balise Exemple starOffset est le dcalage par rapport au dbut du texte une longueur reprsente une distance le long du chemin mesure selon la mtrique de l'espace utilisateur un pourcentage reprsente un pourcentage par rapport au chemin entier selon la mtrique de l'espace utilisateur
  • Page 27
  • 6-7 Mai 2002STAF2x Grassioulet et Nova27 Le rendu Les lments, et les formes de base peuvent tre remplis et coloris (c'est dire peints sur les bords). On parle donc de rendu En SVG, on peut rendre avec : une couleur simple un gradient (linaire ou radial) un motif (vecteur ou image) des motifs personnaliss disponibles par extension
  • Page 28
  • 6-7 Mai 2002STAF2x Grassioulet et Nova28 Spcifications pour le rendu Deux proprits fill et stroke se partagent les attributs suivants : couleur uri de la couleur ou du gradient Proprits de fill (remplissage) opacit Proprits de stroke (dessin) paisseur jonction de lignes arrondi des angles pointills Exemple A noter que lon peut aussi remplir avec des gradients et des motifs (cf. spcifications)
  • Page 29
  • 6-7 Mai 2002STAF2x Grassioulet et Nova29 Insertion dune image Formats bitmap supports: png et jpeg permet galement d'insrer un fichier svg Attributs utiliss: x et y : coordonnes width = "largeur" et height = "hauteur" xlink:href = "uri" dfinit l'URI o se trouve l'image Possibilit de dfinir des masques et des chemins de dcoupe (clipping path) Exemple :
  • Page 30
  • 6-7 Mai 2002STAF2x Grassioulet et Nova30 Petit exercice Afficher une image et en dessous une lgende dans un rectangle bleu avec un contour noir
  • Page 31
  • 6-7 Mai 2002STAF2x Grassioulet et Nova31 Liens On distingue les liens extra et intra document SVG Liens extra document : ils sont pris en charge par l'lment analogue l'lment correspondant de HTML ou SMIL Utilise la syntaxe de XLink ( en cours de spcification ) Exemple : Mailto possible :
  • Page 32
  • 6-7 Mai 2002STAF2x Grassioulet et Nova32 Lien interne Ncessite de spcifier un fragment SVG Analogue HTML : MyDrawing.svg#MyView Rfrence compatible avec XPointer : MyDrawing.svg#xptr(id('MyView')) Spcification d'une vue SVG : MyDrawing.svg#svgView(viewBox(0,200,1000,1000))
  • Page 33
  • 6-7 Mai 2002STAF2x Grassioulet et Nova33 Rfrencement Ncessit davoir un rfrencement pour les liens internes ( ancre ) Rfrencement relatif : la rfrence est locale.......
  • Page 34
  • 6-7 Mai 2002STAF2x Grassioulet et Nova34 Le document SVG est la racine dun document SVG On peut imbriquer des lments SVG Lintrt est que lon cre ainsi un nouveau systme de coordonnes. On peut alors rutiliser des fragments graphiques sans devoir modifier les coordonnes.
  • Page 35
  • 6-7 Mai 2002STAF2x Grassioulet et Nova35 Mtadonnes (1) Les balises et permettent de documenter le code SVG. Ce sont des mtadonnes Ca permet de mieux comprendre le code et dindexer le code SVG On peut les mettre dans les lments suivants : Les conteneurs ( 'svg', 'g', 'defs' 'symbol', 'clipPath', 'mask', 'pattern', 'marker', 'a' et 'switch') Les lments graphiques ('path', 'text', 'rect', 'circle', 'ellipse', 'line', 'polyline', 'polygon', 'image' et 'use')
  • Page 36
  • 6-7 Mai 2002STAF2x Grassioulet et Nova36 Mtadonnes (2) La structure autorise l'insertion de commentaires non rendus (ne saffichant pas) La structure autorise un titre pouvant tre rendu par les viewers dans le bandeau par exemple Exemple: Mon image Cette image ne contient qu'un rectangle
  • Page 37
  • 6-7 Mai 2002STAF2x Grassioulet et Nova37 Elments de structuration SVG autorise le regroupement des objets dans des blocs. Cette modularit permet la rutilisation des objets Les objets cres peuvent dfinir des hirarchies dans laquelle les blocs enfants hritent des attributs des objets parents. Racine svg, groupage dlments, objets abstraits, section de dfinition, utilisation des lments et description
  • Page 38
  • 6-7 Mai 2002STAF2x Grassioulet et Nova38 Groupement dlments Llment sert grouper des lments qui se partagent des attributs communs : couleur, style,... Les enfants de hritent des proprits On peut documenter le group avec et
  • Page 39
  • 6-7 Mai 2002STAF2x Grassioulet et Nova39 Objet abstrait Avec la balise, on peut dfinir des objets graphiques rutilisables dans les cas suivants Objet instancier de multiples fois Objet classique rfrenc par de nombreux lments Dfinition d'un lment de police textuel ... La diffrence avec est que lobjet lui-mme nest pas dessin, il faut lappeler avec Exemple :
  • Page 40
  • 6-7 Mai 2002STAF2x Grassioulet et Nova40 Section de dfinition La balise autorise la dfinition d'objets rfrencs plus tard dans le mme fichier. Il est requis que toutes les dfinitions d'objets devant tre rfrencs plus tard soient faites dans la mme structure Il n'y a donc qu'une structure par fichier SVG Exemple :.......
  • Page 41
  • 6-7 Mai 2002STAF2x Grassioulet et Nova41 Utilisation dlments sert viter de rpter du code en permettant de rutiliser les objets suivants:,,, lments graphics et Pour rutiliser un objet, ceux-ci doivent avoir un identificateur XML. Par exemple : x, y, width, height permettent de repositionner et de redimensionner l'objet xlink:href permet de rfrencer et instantier l'objet (avec son attribut "id" ) On pourrait aussi rajouter des attributs diffrents dans le (comme opacity)
  • Page 42
  • 6-7 Mai 2002STAF2x Grassioulet et Nova42 Le systme des coordonnes A l'origine l'lment le plus externe tablit un espace utilisateur Chaque lment interne redfinit un nouvel espace utilisateur et un nouveau point de vue associ Le rectangle visible pour lutilisateur est appel viewport . Il possde un systme de coordonn qui commence en haut gauche du rectangle. Suivant votre client, vous pouvez vous dplacer ou zoomer dans cet user-space . Les dessins qui dpassent de cette zone sont coups. On peut se crer des viewports (cf. spec)
  • Page 43
  • 6-7 Mai 2002STAF2x Grassioulet et Nova43 Units de longueur On indique les longueurs par une valeur en units absolues ou relatives : em, ex (largeur d'un "m" et hauteur d'un "x" de la fonte courante) px (pixels, unit par dfaut) pt, pc (points, et ??). Normalement le client indique combien de pixels correspond pt ou pc, pareils pour les cm, mm et in. cm, mm, in pourcentages (par rapport au viewport)
  • Page 44
  • 6-7 Mai 2002STAF2x Grassioulet et Nova44 Transformations Sans rentrer dans le dtail ( vous de tester), SVG permet de faire avec la balise transform : Des rotations Des translations Des redimensionnements Des transformations suivant des matrices
  • Page 45
  • 6-7 Mai 2002STAF2x Grassioulet et Nova45 Exercice 1 Faire un groupe dobjets simple (un carr avec du texte) et essayer dappliquer des transformations : rotations, translations, redimensionnement Chercher la syntaxe des transformations dans les spcifications
  • Page 46
  • 6-7 Mai 2002STAF2x Grassioulet et Nova46 Exercice2 Dfinir une ensemble dobjets comprenant un carr rouge, une lgende et un cercle vert au contour bleu. Lui donner un ID et lappeler dans le fichier SVG, le placer aux coordonnes x= 200 y= 200
  • Page 47
  • 6-7 Mai 2002STAF2x Grassioulet et Nova47 Exercice 3 Ecrire un texte sur un chemin reprsentant un pic et faire en sorte que ce texte soit un lien vers une page web quelconque
  • Page 48
  • 6-7 Mai 2002STAF2x Grassioulet et Nova48 SVG et HTML Embedding SVG in HTML pages Utilisation du tag dans une page HTML (ou Rajouter des scrollbars aux pages web SVG (pratique si limage dpasse) :
  • Page 49
  • 6-7 Mai 2002STAF2x Grassioulet et Nova49 A voir et essayer Si on a le temps : Webdraw Mayura XMLValidator Feature sympa : les filtres
  • Page 50
  • 6-7 Mai 2002STAF2x Grassioulet et Nova50 Exercice 4 Faire un systme de navigation (barre) en utilisant des groupes dobjets, mettre le tout dans une page HTML Faites pas ca :)ca
  • Page 51
  • 6-7 Mai 2002STAF2x Grassioulet et Nova51 Animation avec SVG Bon potentiel de SVG pour lanimation en utilisant les modifications des attributs de position, dimension, couleurs, gradients, opacits Animation avec : lments SVG dclaratifs, ECMAScript (javascript) ou dautres langages de manipulation du DOM Animation time-based (et pas frame-based ) But ici : vous montrer un exemple pas tout ce qui est possible
  • Page 52
  • 6-7 Mai 2002STAF2x Grassioulet et Nova52 Mcanisme danimation simple Exemple Code : Freeze : laisse le dessin tel quil saffiche la fin de lanimation
  • Page 53
  • 6-7 Mai 2002STAF2x Grassioulet et Nova53 Animation (2) : chemin Autre exemple simple : permet de crer une animation le long dun chemin (path) Path dfinit la trajectoire de lanimation Exemple :Exemple
  • Page 54
  • 6-7 Mai 2002STAF2x Grassioulet et Nova54 Animation (3) Dans les exemples prcdents, les animations commencent tout de suite. On peut les retarder en mettant un attribut begin= " x " de x secondes comme ici. Scrolling Text : texte animtexte anim Ceci n'est pas un pamplemousse Aprs on peut faire des logos avec des trucs plus compliqus comme caca
  • Page 55
  • 6-7 Mai 2002STAF2x Grassioulet et Nova55 Animation (4) : permet de changer la couleur dun lment Exemple Je suis un cameleon
  • Page 56
  • 6-7 Mai 2002STAF2x Grassioulet et Nova56 Exercice 5 Faire une barre de dfilement qui se comporte comme celacela
  • Page 57
  • 6-7 Mai 2002STAF2x Grassioulet et Nova57 Exercice 6 Dessiner un chemin noir (path) ferm et un cercle rouge qui se dplace du dbut la fin. Faire varier la couleur du cercle (de rouge bleu) le long du parcours
  • Page 58
  • 6-7 Mai 2002STAF2x Grassioulet et Nova58 Exercice 7 Faire une bannire anime, en combinant par exemple des transformations (rotations) et des animations (on fait alors varier langle de rotation au cours du temps) Rien que ca, c long :(ca Bien sur, il y a des possibilites danimations beaucoup plus complexes !! Cf spec
  • Page 59
  • 6-7 Mai 2002STAF2x Grassioulet et Nova59 Evnements interactifs Bon potentiel galement pour les interactions. Il sagit de dfinir des vnements Exemple simpleExemple On dcrira pas
  • Page 60
  • 6-7 Mai 2002STAF2x Grassioulet et Nova60 Gnrer du SVG Jusqu maintenant, on a vu du SVG statique. En fait, vritable gros intrt/potentiel de SVG = dynamique Surtout lien avec monde XML
  • Page 61
  • 6-7 Mai 2002STAF2x Grassioulet et Nova61 Moyen de gnrer du SVG Server-side scripting : Perl, PHP : facile XSLT : plus complexe mais plus trendy et plus davenir Processeur : xslate par exemple But ici : vous montrer des exemples simples pour gnrer du SVG
  • Page 62
  • 6-7 Mai 2002STAF2x Grassioulet et Nova62 Gnrer SVG avec PHP On peut partir dun fichier php simple ou dune BD (mySQL) On pourrait aussi crire un script php qui parse les donnes XML et les renvoient en SVG Pourquoi faire ? -Utiliser des variables pour les attributs par ex : pour les dimensions, les dures danimations -Gnrer des tags -Utilisation de formulaires et script de visualisation directe de donnes
  • Page 63 SVG Plusieurs solutions : Un processeur : xslate, saxon Cocoon : marche pas avec la version dispo a">
  • 6-7 Mai 2002STAF2x Grassioulet et Nova68 XML -> SVG Plusieurs solutions : Un processeur : xslate, saxon Cocoon : marche pas avec la version dispo a tecfa En client-side avec Mozilla
  • Page 69
  • 6-7 Mai 2002STAF2x Grassioulet et Nova69 Exemple On dfinit un DTD simple : On crit le fichier XML correspondant : STAF Students are so cool
  • Page 70
  • 6-7 Mai 2002STAF2x Grassioulet et Nova70 Exemple (2) Le fichier XSL :
  • Page 71
  • 6-7 Mai 2002STAF2x Grassioulet et Nova71 Exemple (3) Ensuite, on utilise un processeur qui va permettre de faire la transformation XML -> SVG Xslate ou saxon A Tecfa, xslate sur tecfasun5.unige.ch (taper xslate pour voir les options et les attributs rentrer)
  • Page 72
  • 6-7 Mai 2002STAF2x Grassioulet et Nova72 Commande xslate Syntaxe : xslate -IN fichier.xml -XSl fichier.xsl -OUT fichier.svg Le processeur xslate crit un fichier svg en sortie.
  • Page 73
  • 6-7 Mai 2002STAF2x Grassioulet et Nova73 Exercice rendre Gnrer un fichier SVG avec la mthode que vous voulez (php ou xslt) pour reprsenter graphiquement des informations simples (par exemple un pie chart reprsentant des pourcentages, avec couleur, lgende) + Rapport explicatif as usual :) Vous pouvez commencer bosser dessus maintenant ! Vous pouvez nous demander notre avis (faisabilit)