Travaux Dirigés de aci
6. Un bon SVGraphique vaut mieux qu’un long HtexteML

Le canevas donné avec cet énoncé est destiné à lire sur son flux d’entrée un texte html supposé contenir une et une seule table bien formée, chaque cellule ayant comme texte un nombre entier écrit en base 10, et ayant des attributs spécifiant la couleur du texte (color), du fond (bgcolor) et son éventuelle fusion avec les cellules adjacentes (colspan). Le but de l’application est de retourner sur le flux de sortie une traduction graphique, en SVG, de cette table.

L’analyseur syntaxique employé est toujours EXPAT. Le canevas dispose de la fonction find_attribute pour exploiter une des principales données fournies par EXPAT. Les balises ouvrantes sont traitées par la fonction startElement, qui indexe un tableau de fonctions à travers la deuxième lettre de la balise, les seules intéressantes ici étant table, tr et td. Les balises fermantes sont traitées par endElement, définie dans le canevas : elle se contente de repérer la balise tr pour mettre à jour le compteur de lignes figurant dans la variable own locale à main mais transmise par l’analyseur grâce à la déclaration par XML_SetUserData.


peroraison.h
tablehtml.c
Makefile
test.html


1 A table

On suppose que les seuls attributs de la balise table sont width et height. Ecrire la fonction appelée automatiquement par le canevas pour cette balise, afin qu’elle mémorise les valeurs de ces deux attributs dans les champs homonymes de la variable own locale à main.


Obtenir un formulaire de soumission de comptes rendus

2 La pêche au nombre

La structure own contient un attribut last_markup censé contenir td si on vient de rencontrer une telle balise ouvrante. Définir la fonction HandlerCharacterData afin qu’elle mémorise dans le champ contenu de la structure en cours de construction le nombre figurant dans la cellule td en cours d’analyse.


Obtenir un formulaire de soumission de comptes rendus

3 Se souvenir du TD

A chacune des apparitions de la balise td, il faut allouer une structure de type liste_de_case, la chaîner dans la variable own locale à main et la remplir correctement. On suppose ici que cette balise peut contenir seulement les 3 attributs suivants, non nécessairement présents :

Ecrire la fonction automatiquement appelée par le canevas à la rencontre de cette balise, et réalisant l’allocation et le chaînage souhaités. S’il agit de la première ligne, elle incrémente également le champ nb_td de la variable own locale à la fonction main.


Obtenir un formulaire de soumission de comptes rendus

4 A bas la table

On souhaite donc représenter chaque ligne de la table par une suite de rectangles. La largeur de chaque rectangle sera proportionnelle à la valeur de l’attribut colspan de la cellule, et la hauteur sera proportionnelle à la valeur numérique figurant dans la cellule. Les coefficients de proportionnalité sont respectivement EPAISSEUR (défini dans le fichier .h fourni) et 1. On suppose que les hauteurs seront toujours inférieures à HAUTEUR.

En SVG, le dessin d’un rectangle s’obtient simplement par la balise rect, avec les attributs x, y, width, height. On ne s’occupera pas de la couleur pour le moment. Le repère du système de coordonnées est dans le coin supérieur gauche ; on peut le changer avec la balise g et son attribut transform égal à une chaîne comme ’translate(x,y),scale(rc,ry)’.

Trouver la traduction en SVG de la table donnée en exemple. Ecrire ensuite la fonction affiche_table, appelée à la fin de main, produisant le SVG correspondant au flux d’entrée fourni.


Obtenir un formulaire de soumission de comptes rendus

5 Dégrader la table

On souhaite enfin colorer chaque rectangle par un dégradé de couleur allant de 5% de son attribut color à 95% de son attribut bgcolor. En SVG on définit un dégradé par la balise LinearGradient encadrant ici deux balises stop avec un attribut offset et un attribut stop-color.

Définir la fonction definit_degrade qui rajoute au document SVG à produire une zone defs comportant tous les dégradés nécessaires. On utilisera un attribut id pour nommer chaque gradient, avec un nom issu du numéro de cellule (par exemple LnCm).

Modifier la fonction de la question précédente pour colorer les rectangles, à l’aide de l’attribut fill="url(#nom)".


Obtenir un formulaire de soumission de comptes rendus

logo-spip E. Saint-James & F. Kordon - Master Informatique - UPMC Valid XHTML 1.0!
Calculé le 23 janvier 2021 à 00h14min