Issuu on Google+

Transformation de MathML en SVG par XSLT.

M´ emoire pr´ esent´ e en vue de l’obtention du grade de licenci´ e en informatique par Alexandre Stevens.

Promoteur : Justus H. Piater

Ann´ee acad´emique 2004-2005. Version du 24 juillet 2005.


Remerciements Je remercie Justus H. Piater de m’avoir propos´e ce sujet de m´emoire qui me correspondait si bien. Merci pour ses bonnes id´ees et son aide. Je remercie ´egalement Olivier Goens, Rapha¨el Mar´ee, Olivier Barnich ainsi que mon p`ere pour le travail de relecture et les conseils de r´edaction. Enfin, je remercie toutes les personnes qui m’ont soutenues durant ces ann´ees pass´ees a` l’universit´e et en particulier mon grand-p`ere qui prenait, jusqu’il y a peu, de nombreuses nouvelles de l’´etat d’avancement de ce travail. Je suis ´egalement tr`es reconnaissant envers mes parents et mes grand-parents qui se sont constamment pr´eoccup´es de ma scolarit´e et soutenus pendant toutes mes ´etudes universitaires. Merci aussi `a Luca Padovani qui n’a jamais refus´e de r´epondre `a mes questions et avec qui j’ai pu ´echanger des r´eflexions int´eressantes `a propos de ce travail.

1


Rien ne se perd, rien ne se cr´ee, tout se transforme. Antoine-Laurent de Lavoisier, 1743-1794.

2


R´ esum´ e MathML1 est le langage recommand´e par le W3C2 pour repr´esenter des ´el´ements math´ematiques en XML. MathML est export´e par de nombreux outils math´ematiques, et est support´e par quelques navigateurs Web (notamment, ceux bas´es sur Mozilla3 ), ou par des plug-ins. Cependant, il n’y a que tr`es peu d’outils, dont pratiquement aucun logiciel libre, pour transformer du MathML en un format destin´e au papier (PDF, etc.). SVG4 est le langage recommand´e par le W3C pour repr´esenter des graphiques vectoriels (Scalable Vector Graphics). SVG est export´e par de nombreux outils graphiques, et est support´e par de nombreux navigateurs soit directement, soit par moyen des plug-ins. De plus, il existe des outils pour la mise en page de textes XML pour le papier, dont notamment le logiciel libre FOP, qui traitent directement des graphiques cod´es en SVG. Par cons´equent, une solution (pratique, flexible et g´en´erale) serait de mettre en place un outil pour transformer des formules du MathML en SVG afin de les inclure, par exemple, dans des textes `a imprimer. De plus, puisque les deux langages en question sont des langages XML, il semble naturel de coder cette transformation en XSLT. Ce travail traite donc de diff´erents dialectes XML et expose une m´ethode de production d’un document SVG en XSLT `a partir d’un document MathML.

1

http http 3 http 4 http 2

://www.w3.org/Math/ ://www.w3.org/ ://www.mozilla.org/ ://www.w3.org/Graphics/SVG/

3


Table des mati` eres Remerciements

1

1 Introduction 1.1 Pr´eliminaire . . . . . . . . . . . . . 1.2 Pr´esentation du travail et objectifs 1.3 Pr´esentation du probl`eme . . . . . 1.4 R´esultats obtenus . . . . . . . . . . 1.5 Structure du TFE . . . . . . . . .

. . . . .

10 10 11 12 12 13

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Language Transformations) . . . . . . . . . . . . . . . .

14 14 14 14 16 21 23 26

3 M´ ethode de production 3.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3.2 Une solution en deux ´etapes. . . . . . . . . . . . . . . . . . . . . . . . . . 3.2.1 Premi`ere id´ee . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3.2.2 Une autre id´ee . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3.2.3 Le contexte de formatage . . . . . . . . . . . . . . . . . . . . . . . 3.2.4 Du MathML vers un arbre interm´ediaire `a boˆıtes . . . . . . . . . . 3.3 G´en´eration de l’arbre interm´ediaire . . . . . . . . . . . . . . . . . . . . . . 3.3.1 Cr´eation du noeud interm´ediaire pour une feuille de l’arbre source 3.3.2 Description des op´erations . . . . . . . . . . . . . . . . . . . . . . . 3.3.3 Cr´eation d’une boˆıte pour un noeud poss´edant un ou plusieurs fils 3.4 De l’arbre interm´ediaire au SVG . . . . . . . . . . . . . . . . . . . . . . . 3.5 Rapidit´e de la transformation . . . . . . . . . . . . . . . . . . . . . . . . . 3.6 Construction de l’arbre en une seule passe . . . . . . . . . . . . . . . . . . 3.7 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

27 27 27 27 28 28 29 30 30 31 32 33 33 34 34

2 Etude du domaine 2.1 Introduction . . . . . . . . . 2.2 Repr´esentation des donn´ees 2.2.1 XML . . . . . . . . . 2.2.2 MathML . . . . . . 2.2.3 SVG . . . . . . . . . 2.2.4 Introduction `a XSLT 2.3 Conclusion . . . . . . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . (eXtensible Style . . . . . . . . . .

4

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .


` TABLE DES MATIERES

5

4 Particularit´ es du rendu de formules math´ ematiques 35 4.1 Le choix de la police utilis´ee . . . . . . . . . . . . . . . . . . . . . . . . . . 35 4.2 Le probl`eme d’ajustement optique . . . . . . . . . . . . . . . . . . . . . . 37 5 R` egles de transformations 5.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.2 La racine du document MathML . . . . . . . . . . . . . . . . . . . . . . 5.3 mi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.4 mn, mtext . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.5 ms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.6 mspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.7 mo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.8 mglyph . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.9 msub . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.10 msup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.11 msubsup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.12 msqrt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.13 mroot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.14 mfrac . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.15 munder, mover, munderover . . . . . . . . . . . . . . . . . . . . . . . . . 5.16 mrow, merror, mphantom . . . . . . . . . . . . . . . . . . . . . . . . . . 5.17 mpadded, mstyle, mfenced, mtable, mlabeledtr, mtr, mtd, maction, menclose, mmultiscripts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.18 La gestion des attributs des balises du MathML . . . . . . . . . . . . . . 5.19 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. 52 . 56 . 57

6 Les 6.1 6.2 6.3 6.4 6.5 6.6 6.7 6.8 6.9

. . . . . . . . .

r´ esultats Einstein . . . . . . . . . . . . . . . . . . . . . Une simple ´equation . . . . . . . . . . . . . . Une racine . . . . . . . . . . . . . . . . . . . . Fractions imbriqu´ees . . . . . . . . . . . . . . Equation contenant des fractions . . . . . . . Friedman-Robertson-Walker . . . . . . . . . . Un exposant et des fractions . . . . . . . . . . Un petit m´elange de divers ´el´ements MathML Des indices . . . . . . . . . . . . . . . . . . .

7 Conclusions

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . .

. . . . . . . . . . . . . . . .

38 38 38 39 40 41 42 42 44 44 45 45 46 47 48 50 50

58 58 58 59 59 59 60 60 60 61 62


Table des figures 1.1 1.2 1.3 1.4

Transformation MathML en Formule quadratique . . . . Un peu de trigonom´etrie . . Fraction et exposant . . . .

2.1 2.2

Repr´esentation de la c´el`ebre formule d’Einstein sous forme d’arbre MathML Transformation suppl´ementaire `a r´ealiser si le MathML est d´ecrit au moyen d’un balisage de contenu. . . . . . . . . . . . . . . . . . . . . . . . SVG : L’ordonn´ee augmente lorsqu’on se d´eplace du haut vers le bas. . . . Processeur XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

2.3 2.4 3.1 3.2 3.3 3.4

4.1

SVG . . . . . . . . .

par XSLT . . . . . . . . . . . . . . . . . .

: le chaˆınon . . . . . . . . . . . . . . . . . . . . .

manquant. . . . . . . . . . . . . . . . . . . . . .

. . . .

. . . .

La transformation s’op`ere en deux ´etapes . . . . . . . . . . . . . . . . . Ensemble des boˆıtes correspondant `a la formule E = mc2 . . . . . . . . Construction r´ecursive de l’arbre interm´ediaire : les noeuds du MathML (ronds) deviennent des boˆıtes (carr´es) de l’arbre interm´ediaire. . . . . . E = mc2 . De l’arbre interm´ediaire vers le SVG. Parcours niveau par niveau en partant de la racine en cr´eant les noeuds dans l’arbre r´esultat. . . . .

. . . .

12 13 13 13 17 19 22 23

. 28 . 29 . 30 . 33

Les symboles dont la taille est variable sont g´en´eralement dessin´es `a l’aide de symboles compos´es. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37

5.1 5.2 5.3 5.4 5.5 5.6 5.7 5.8 5.9 5.10

Mod`ele s’appliquant `a la racine de l’arbre MathML . . . . . . . . . . . . . Exemples simples de transformation d’un ´el´ement ’mi’. . . . . . . . . . . . Exemple de redimensionnement d’un type d’´el´ement mo. . . . . . . . . . . Sch´ema aidant au calcul de la taille de la boˆıte de msub. . . . . . . . . . . Sch´ema aidant au calcul de la taille de la boˆıte de msup. . . . . . . . . . . Sch´ema aidant au calcul de la taille de la boˆıte de msubsup. . . . . . . . . Dessin du radical. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sch´ema aidant au calcul de la taille de la boˆıte de mroot. . . . . . . . . . Sch´ema aidant au calcul de la taille de la boˆıte de mfrac. . . . . . . . . . . La balise mfrac dans le cas o` u le num´erateur et le d´enominateur ont la mˆeme largeur. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.11 Sch´ema aidant au calcul de la taille de la boˆıte de mrow et `a la compr´ehension de la mani`ere dont les fils sont construits. . . . . . . . . . . . . . . . . . . 6

39 40 43 45 45 46 47 48 48 49 51


TABLE DES FIGURES 5.12 5.13 5.14 5.15

Ajustement des ´el´ements sur une mˆeme ligne de base. . . . . . . . . . . Matrice identit´e 3*3 repr´esent´ee en MathML. . . . . . . . . . . . . . . . Probl`emes li´es au calcul de la boˆıte correspondant `a un ´el´ement mtable. Gestion des attributs MathML vers SVG via la balise de groupement g.

7 . . . .

51 53 55 56


Liste des tableaux 2.1

Elements de pr´esentation MathML. . . . . . . . . . . . . . . . . . . . . . . 20

3.1

Contexte de formatage initial de MathML . . . . . . . . . . . . . . . . . . 29

8


Note Ce travail a ´et´e pr´esent´e en juin 2005 et a ´et´e r´eussi avec la mention Grande Distinction. Les mod`eles XSLT, `a l’heure o` u ce rapport est publi´e, ne sont pas encore utilisables et demandent encore un peu de d´eveloppement `a cause de l’envergure de MathML. Cependant, le concept est bon et prend en compte tout ce qu’il faut pour permettre de compl´eter l’impl´ementation de mani`ere nette. Bonne lecture.

9


Chapitre 1

Introduction 1.1

Pr´ eliminaire

La production de documents scientifiques n´ecessite la possibilit´e d’exprimer et de manipuler une grande diversit´e d’objets comme du texte simple, des formules math´ematiques ou des sch´emas. Ces donn´ees doivent pouvoir ˆetre partag´ees avec d’autres utilisateurs en les publiant sur un site Web ou en les pla¸cant dans des documents au format PDF1 et `a terme, en permettant une impression et/ou une modification ais´ee de ceux-ci. Par exemple, les navigateurs les plus utilis´es tels que Mozilla, Microsoft Internet Explorer ou Safari permettent d’afficher des documents ´ecrits dans le langage HTML, le langage de balisage des sites Web. Or, l’HTML ne prend pas automatiquement en charge les formules math´ematiques. Comment, d`es lors, publier de tels documents sur Internet ? Le moyen actuel le plus r´epandu pour r´ealiser cette tˆache est de cr´eer ces formules via un programme d’´edition d’´equations (ou via un programme qui cr´ee automatiquement ces formules en les convertissant depuis une autre repr´esentation) et ensuite de les convertir en une image (de type bitmap2 ) affichable par un navigateur. On ins`ere alors ces images dans une page en tant que graphique. Cette m´ethode pose quelques probl`emes : les op´erations copier/coller sont irr´ealisables, la qualit´e d’impression est assez faible, on ne dispose d’aucune interaction avec la formule, le document ne peut-ˆetre agrandi sans perte de qualit´e, ces formats ne sont pas standards pour le Web et pour les math´ematiques. 1 2

Portable Document Format. Format de donn´ees qui se compose d’un tableau de points de couleur (g´en´eralement rectangulaire).

10


CHAPITRE 1. INTRODUCTION

1.2

11

Pr´ esentation du travail et objectifs

Le langage MathML (Mathematical Markup Language)3 a ´et´e developp´e dans le but de r´epondre au probl`eme du codage et de la repr´esentation des math´ematiques grˆace `a des balises adapt´ees `a ce type d’information. La reconnaissance de MathML comme standard est aujourd’hui atteinte, mais son utilisation par un large public d´ependra ´egalement beaucoup des logiciels d’´edition et de traitement d´evelopp´es autour de ce langage. Ce m´emoire traite de la g´en´eration automatis´ee, `a partir d’un document source MathML, de graphiques vectoriels au format SVG4 , standard permettant de r´epondre aux probl`emes pr´ecit´es. Le fait que le SVG soit tr`es r´epandu et soit bas´e sur XML en fait un format extrˆemement flexible. On cherche donc `a transformer le code MathML en SVG, ce dernier op´erant le rendu final pouvant ˆetre vu par l’utilisateur. Le but de ce travail est de d´efinir une solution permettant cette transformation et de l’impl´ementer dans un langage non usuel : le XSLT, dialecte XML qui a ´et´e cr´e´e dans le but de transformer une structure XML en une autre structure XML. Il existe cependant d’autres solutions op´erant du rendu de formules math´ematiques `a partir du MathML. Ces solutions utilisent la majorit´e du temps TEX 5 qui va `a terme disparaˆıtre pour laisser la place `a des chaˆınes d’outils bas´es sur XML. Le but de ce travail est donc de d´efinir une solution unique qui peut ˆetre utilis´ee dans des contextes vari´es. R´ealiser cette transformation en XSLT offre une grande portabilit´e et ´enorm´ement de flexibilit´e. Un logiciel d´edi´e `a cette tˆache existe d´ej`a dans le domaine propri´etaire : Custard6 qui r´ealise cette transformation (dans les langages XSLT et JAVA) moyennement bien (`a cause d’une mauvaise gestion des polices). Ce programme est payant (ce qui freine sa distribution au grand public) et le code source n’est pas disponible. Un ´etudiant russe7 a ´egalement fait des recherches concernant cette transformation (celles-ci sont d´esormais `a l’arrˆet). Bien que la majorit´e des r`egles de transformation ´etaient impl´ement´ees, le rendu final ´etait de tr`es mauvaise qualit´e : la m´ethode fournissait une pi`etre gestion des placements entre les diff´erents ´el´ements composant la formule math´ematique. 3 Not´e aussi MML. D´eriv´e du XML. Format ´emergeant recommand´e par le W3C (World Wide Web Consortium) - http ://www.w3c.org/ 4 SVG est le langage recommand´e par le W3C pour repr´esenter des graphiques vectoriels (Scalable Vector Graphics). SVG est export´e par de nombreux outils graphiques, et est support´e par de nombreux navigateurs et plug-ins. De plus, il existe des outils pour la mise en page de textes XML (plus pr´ecisement, XSL-FO XSL Formatting Objects) pour le papier, dont notamment le logiciel libre FOP, qui traitent directement des graphiques cod´es en SVG. 5 Le logiciel TEX est un traitement de texte scientifique particuli`erement adapt´e ` a l’´ecriture des symboles math´ematiques. 6 http ://www.schemasoft.com/MathML/ 7 http ://sourceforge.net/projects/mmltosvg


CHAPITRE 1. INTRODUCTION

12

MathML

XSLT SVG

PDF (transformation et formatage d'objets)

HTML

Diagramme SVG composite

Fig. 1.1 – Transformation MathML en SVG par XSLT : le chaˆınon manquant.

Un autre objectif de ce m´emoire est donc de d´evelopper une alternative (au rendu le plus optimal possible) sous licence libre (et donc gratuite) `a ces produits et de pouvoir fournir, `a celui qui le souhaite, ces r`egles de transformations.

1.3

Pr´ esentation du probl` eme

Le mot math´ematique est associ´e de mani`ere inh´erente `a diff´erents concepts : formalisation, compr´ehension ou s´emantique. Les math´ematiques, c’est aussi un langage, avec une notation visuelle complexe (et bidimensionnelle), qui a ´evolu´e au cours des diff´erents si`ecles. Formater ou faire du rendu de formules math´ematiques `a partir d’une repr´esentation ´electronique est loin d’ˆetre ´evident : cela peut d´ependre de la s´emantique de la formule math´ematique, du contexte culturel, des resources disponibles (par exemple : largueur de l’´ecran ou largueur du document). Des probl`emes particuliers se posent pour les formules math´ematiques. Ces probl`emes sont dˆ us `a leurs structures et aux types de sous-formules qu’elles peuvent contenir : fractions, matrices, int´egrales, ou mˆeme exposants ou indices. Ce rapport doit montrer le processus utilis´e pour formater le MathML en SVG via XSLT. Ce processus doit r´epondre aux diff´erents probl`emes pr´ecit´es.

1.4

R´ esultats obtenus

Voici quelques exemples (basiques) de formules g´en´er´ees `a partir de ce travail. Vous retrouverez plus d’exemples dans la suite de ce document. – La police utilis´ee est celle de TEX (d´efinie dans le SVG) ; – l’image est au format SVG (et donc vectorielle, ce qui permet de l’agrandir ou la r´eduire proprement et d’imprimer celle-ci avec une haute qualit´e ou de l’int´egrer, comme le d´emontrent ces exemples, avec une qualit´e de rendu proche de TEX dans un document PDF) ; – la taille de l’image est proportionnelle `a la formule qu’elle contenait.


CHAPITRE 1. INTRODUCTION

13

Fig. 1.2 – Formule quadratique

Fig. 1.3 – Un peu de trigonom´etrie

Fig. 1.4 – Fraction et exposant

Ce travail tente de s’approcher au plus pr`es de la qualit´e de rendu des formules de TEX .

1.5

Structure du TFE

Dans ces pages, nous allons donc parler : – de langages de balisages, d’applications XML ; – de typographie num´erique, de mise en page, de m´etrique de polices ; – d’une formalisation de mise en page ; – de XSLT, langage permettant la transformation. La premi`ere ´etape fut d’expliquer bri`evement ce que sont le XML, MathML, SVG et XSLT : les bases de ce travail. Ensuite, la m´ethode de production du graphique vectoriel SVG est expliqu´ee. Les diff´erentes ´etapes de transformations sont pr´esent´ees, ainsi que la mani`ere dont la tˆache a ´et´e r´ealis´ee tout en pr´ecisant toutes les phases du d´eveloppement. Ce rapport se clˆoture par quelques exemples.


Chapitre 2

Etude du domaine 2.1

Introduction

Pour bien comprendre ce m´emoire et l’application d´evelopp´ee, il est n´ecessaire d’ˆetre familier avec l’univers XML, technologie standard qui peut ˆetre exploit´ee pour l’encodage, la communication et la maintenance de documents structur´es. En effet, on veut transformer du MathML en SVG. Ces langages sont des applications (ou dialectes) du XML : les r`egles du XML ont ´et´e appliqu´ees pour cr´eer le langage MathML et le langage SVG. Nous allons donc commencer par pr´esenter le XML. Nous pr´esenterons ensuite chacun de ces langages. On terminera par une pr´esentation de XSLT, langage qui permet, comme nous l’avons d´ej`a signal´e au chapitre pr´ec´edent, de modifier une structure XML en une autre structure XML.

2.2 2.2.1

Repr´ esentation des donn´ ees XML

Nous allons, dans cette sous-section, dessiner une petite description de XML. Si vous n’ˆetes pas familier avec ce standard, mieux vaut vous rapporter `a des ouvrages traitant de mani`ere plus d´etaill´ee de ce sujet. XML est l’acronyme de eXtensible Markup Language (langage de balisage1 extensible). Ce standard dispose d’une structure hi´erarchique qui permet de repr´esenter des documents et leurs structures. Ce langage, ainsi que ses librairies, sont d´ecrits par des recommandations publi´ees par le W3C. Sa syntaxe lui permet de d´efinir d’autres langages de description plus sp´ecifiques (le MathML pour les formules math´ematiques par exemple). L’int´erˆet du XML est de contenir la d´efinition de la structure du document `a l’int´erieur de ce mˆeme document. XML d´ecrit donc uniquement une structure et la 1 Le plus utilis´e et r´epandu d’entre-eux est le HTML (attention : l’HTML n’est pas un dialecte XML, juste un langage de balisage).

14


CHAPITRE 2. ETUDE DU DOMAINE

15

signification du contenu d’un document. D`es lors, des programmes peuvent traiter ces documents de mani`ere tr`es flexible : – Aucune connaissance d’un langage sp´ecifique pr´ealable n’est requis. – Il est facile de les ´editer, les valider, acc´eder `a une sous-partie des documents, les manipuler, les construire ou les transformer. Ce langage descriptif permet donc de cr´eer, selon les besoins, des balises utiles `a un document. D´ efinition de la structure d’un document XML Un document XML doit respecter des r`egles. Nous allons vous en pr´esenter quelques unes : 1. Le document doit commencer par la d´eclaration XML. 2. Les ´el´ements contenant des donn´ees doivent avoir une balise ouvrante et une balise fermante. 3. Les ´el´ements vides ne comportant qu’une balise doivent la clore par />. 4. Le document doit contenir un et un seul ´el´ement racine qui est le parent des autres. 5. Les ´el´ements peuvent s’imbriquer mais pas se chevaucher. 6. Les valeurs des attributs doivent ˆetre d´elimit´es par des guillemets (ou des apostrophes). 7. Les m´eta-caract`eres < et & ne doivent ˆetre utilis´es que pour d´emarrer respectivement une balise et une r´ef´erence d’entit´e2 . On remarque donc qu’un document XML est bien plus strict qu’un document HTML. XML est compos´e de deux niveaux de conformit´e : 1. Pour la bonne formulation : crit`ere minimum afin de permettre la lecture d’un fichier XML. Un programme analysant un document XML ne peut corriger celuici : c’est interdit par la sp´ecification du XML. 2. Pour la validit´e : le concepteur d’un document XML doit avoir la possibilit´e d’imposer `a l’auteur d’un document des r`egles de structuration qu’il aura d´efini. C’est le rˆole de la DTD3 qui a pour but de d´efinir ces r`egles. Il existe cependant deux alternatives : – D´efinir ces r`egles `a partir de sch´emas (d´efinis en) XML. On peut contrˆoler, via ces sch´emas, plus finement la DTD. – Utiliser Relax-NG. Ce dialecte XML permet de d´efinir pr´ecis´ement les diff´erentes contraintes qui d´eterminent la classe de documents XML qui peuvent passer l’´etape de validation. 2 Les entit´es sont des substituts pour des s´equences d’informations. Ces entit´es doivent ˆetre d´efinies dans l’entˆete du document XML, ou dans la DTD (pr´esentation de la DTD ci-apr`es), et peuvent ˆetre r´ef´erenc´ees ` a une ou plusieurs reprises dans le document. 3 Document Type Definition


CHAPITRE 2. ETUDE DU DOMAINE

2.2.2

16

MathML

Pr´ eliminaire Maintenant que l’on a introduit le XML, on peut introduire le MathML qui est une application de notation math´ematique. MathML, actuellement dans sa recommandation 2.0 (21 f´evrier 2001), a pour but d’identifier `a la fois la typographie et/ou le sens math´ematique d’une expression. Il dispose, comme tout dialecte XML, d’une DTD. Un petit exemple pour comprendre Une fraction est constitu´ee d’un num´erateur et d’un d´enominateur. MathML fournit donc une balise <mfrac> qui contient deux balises pouvant ˆetre de tout type. La premi`ere repr´esente obligatoirement le num´erateur, la deuxi`eme repr´esente obligatoirement le d´enominateur. a b

s’´ecrit :

<mfrac> <mi>a</mi> <mi>b</mi> </mfrac> Repr´ esentation d’un document MathML sous la forme d’arbre Prenons la c´el`ebre formule d’Einstein E = mc2 . On peut la repr´esenter par le document MathML suivant : <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE math PUBLIC "-//W3C//DTD MathML 2.0//EN" "dtd/mathml2.dtd"> <math xmlns:mml="http://www.w3.org/1998/Math/MathML" id="mymath"> <mrow> <mi>E</mi> <mo>=</mo> <mrow> <mi>m</mi> <msup> <mi>c</mi> <mn>2</mn> </msup> </mrow> </mrow> </math>


CHAPITRE 2. ETUDE DU DOMAINE

17

On peut assimiler les expressions MathML `a des arbres, dont chaque noeud correspond `a un ´el´ement MathML, dont chaque branche sous un noeud p`ere correspond aux fils de celui-ci. Les noeuds terminaux de l’arbre correspondent `a une notation atomique ou `a des unit´es de contenu4 .

math

mrow

mi

mo

mrow

E

=

mi

m

msup

mi

mn

c

2

Fig. 2.1 – Repr´esentation de la c´el`ebre formule d’Einstein sous forme d’arbre MathML

El´ ements de pr´ esentation et de contenu MathML Il y a deux types d’´el´ements MathML : ceux qui concernent la pr´esentation et ceux qui concernent le contenu. La majorit´e des ´el´ements MathML sont constitu´es d’une balise ouvrante et d’une balise fermante, qui englobent `a leur tour le balisage de leur contenu. Dans le cas des atomes, il s’agit d’un contenu de donn´ees textuelles. Dans la majorit´e des autres cas, le contenu est form´e du balisage des fils.

4

El´ements mi, mn et mo pour ce qui concerne les ´el´ements de pr´esentation ; ci, cn et csymbol pour les ´el´ements de contenu (nous reviendrons sur ce point dans la suite).


CHAPITRE 2. ETUDE DU DOMAINE

18

Une forme de balisage de pr´ esentation pour (a + b)2 . <mrow> <msup> <mfenced> <mrow> <mi>a</mi> <mo>+</mo> <mi>b</mi> </mrow> </mfenced> <mn>2</mn> </msup> </mrow> Les ´el´ements de pr´esentation permettent la construction de la notation math´ematique traditionnelle5 . Ces ´el´ements sont ind´ependants du m´edium : ils ont ´et´e con¸cus pour contenir suffisamment d’informations pour leur bon rendu sous diff´erentes formes. Une forme de balisage de contenu pour (a + b)2 . <mrow> <apply> <power/> <apply> <plus/> <ci>a</ci> <ci>b</ci> </apply> <cn>2</cn> </apply> </mrow> Les op´erations math´ematiques existent et sont signifiantes pour de nombreuses applications de mani`ere absolument ind´ependante de leurs rendus. L’objectif du balisage de contenu est de fournir un codage explicite de la structure math´ematique d’une expression (et non pas un rendu particulier). Les balises de pr´ esentation de MathML Le balisage de pr´esentation MathML (celui que nous transformons dans ces pages) consiste en une trentaine d’´el´ements qui acceptent plus de 50 attributs6 . Pour chaque 5 Proche des symboles et des structures de construction d’expression de base ` a partir desquels toute expression math´ematique est construite. 6 La sp´ecification compl`ete du langage MathML est d´efinie sur le site du W3C http ://www.w3.org/Math/.


CHAPITRE 2. ETUDE DU DOMAINE

19

balise (ou, par analogie avec un arbre : pour chaque noeud), il faut ´etablir une r`egle de transformation vers SVG. L`a est la difficult´e de ce travail : trouver le moyen de faire cohabiter 30 ´el´ements (pr´esent´e sous forme de tableau ci-apr`es) et ´etudier la sp´ecification du MathML, de ses balises et de ses attributs en profondeur7 .

Le choix du balisage de pr´ esentation du MathML Le choix a ´et´e fait de ne convertir que les ´el´ements de pr´esentation de MathML vers le SVG. En effet, celui-ci ayant pour but d’aider les personnes souhaitant faire du rendu de formules, c’est pr´ecis´ement ce balisage qui peut permettre de r´ealiser au mieux la transformation. Ce m´emoire ayant pour titre Transformation de MathML en SVG par XSLT, nous nous devions toutefois de justifier un peu plus ce choix. Apr`es quelques recherches sur Internet, j’ai d´ecouvert8 la pr´esence de mod`eles XSLT permettant de transformer le balisage de contenu en un balisage de pr´esentation MathML. D`es lors, une personne souhaitant utiliser la transformation expliqu´ee dans ce travail, mais ayant d´ecrit sa formule math´ematique en un balisage de contenu, pourrait d’abord op´erer une premi`ere transformation vers un balisage de pr´esentation (cMML vers pMML). Cette transformation a ´evidemment un coˆ ut et il pourrait ˆetre envisag´e d’appliquer les r`egles de transformations (expliqu´ees dans ce document) `a ce type de balisage. Ce choix a ´et´e fait afin de limiter, dans ce travail, le nombre de r`egles de transformations `a r´ealiser. MathML (contenu)

mmlCtoP.xsl

MathML (présentation)

pMML2SVG.xsl

SVG

Fig. 2.2 – Transformation suppl´ementaire `a r´ealiser si le MathML est d´ecrit au moyen d’un balisage de contenu.

7

Dans le tableau ci-apr`es, on y parle de glyphe. Un glyphe est une repr´esentation graphique (parmi une infinit´e possible) d’un signe typographique. Il est ´egalement ` a noter que seuls les ´el´ements mi, mn, mo, mtext et ms peuvent contenir du texte. En ce qui concerne la notation, 1∗ sous-entend l’ajout automatique d’une balise mrow si le nombre d’arguments est ≥ 1 (on dit alors que le mrow est inf´er´e ). 8 Sur le site de l’Ontario Research Centre for Computer Algebra, http ://www.orcca.on.ca/


CHAPITRE 2. ETUDE DU DOMAINE Element

20

Arguments

Exemple

mi mn mo mtext ms mspace mglyph

Nombre d’arguments -

x 2 &#x2295; string string -

x 2 ⊕ string string

mrow

0 ou plus

x1 . . . xn

mfrac msqrt mroot mstyle

2 1* 2 1*

xy x xn x

merror mpadded

1* 1*

x x

mphantom

1*

x

mfrenced

0 ou plus

x1 . . . xn

menclose

1*

x

msub msup msubup

2 2 3

xa xb xab

munder mover

2 2

xa xb

munderover

3

xab

mmultiscripts

1 ou plus

x(ai bi ) ∗ (cj dj )∗

mtable mlabeledtr

0 ou plus 1 ou plus

r1 . . . r n ld1 . . . dn

mtr mtd maction

0 ou plus 1* 1 ou plus

d1 . . . d n x x1 . . . xn

Description

identifiant nombre operateur texte texte entre guillemets espace vide ℘ glyphes d´ependant du syst`eme x1 . . . xn aligne n sous-expressions sur une mˆeme ligne de base x , x/y fraction y √ x racine carr´ee √ n x racine avec index x changement du style de l’argument x encadrement de l’argument x ajustement de l’espacement autour d’un ´el´ement contenu invisible (cache l’argument) mais taille respect´ee (x1 , . . . , xn ) ajout de parenth`eses et de s´eparateurs `a des sousexpressions utilisation de notation pour un argument xa indice inf´erieur xb indice sup´erieur b xa paire d’indices inf´erieurs et sup´erieurs indice sous un ´el´ement indice au-dessus d’un ´el´ement paire d’indices en-dessous et au-dessus d’un ´el´ement pr´e-indices et indices tensorielles table ou matrice d1 . . . dn (l) ligne d’une table avec un label d1 . . . d n ligne d’une table x cellule d’une table xi actions accoci´ees `a une sousexpression

Tab. 2.1 – Elements de pr´esentation MathML.


CHAPITRE 2. ETUDE DU DOMAINE

2.2.3

21

SVG

Choisir le format SVG pour faire du rendu de formules math´ematiques pr´esente plusieurs avantages : – Rendu vectoriel : possibilit´e de mettre `a l’´echelle une image sans aucune perte de qualit´e (une image vectorielle est d´efinie par une fonction math´ematique). – Style adaptable. – Compressibilit´e ´elev´ee. – Les ´el´ements graphiques sont des objets hi´erarchiques. – Cr´eation de document interactifs : grˆace au SVG, il est possible de de mixer formules et diagrammes. – Conversion facile : vers du vectoriel (PostScript), vers tout type d’image, vers d’autres dialectes XML. – Facile `a imprimer et `a inclure dans un document PDF (car il existe de nombreux logiciels permettant de convertir du SVG en PDF). – Facile `a int´egrer dans un site Internet. Un point important `a souligner ici est que l’utilisateur doit poss´eder des polices syst`emes pour le rendu des formules math´ematiques en SVG. Cela peut pr´esenter un avantage au niveau de la portabilit´e du SVG mais dans notre cas, on pourrait voir cela comme une restriction. Le placement des ´el´ements math´ematiques, dans le cadre de ce travail, est totalement d´ependant de la m´etrique des caract`eres utilis´es. D`es lors, si un utilisateur ne poss`ede pas la police de caract`eres sp´ecifi´ee dans le document SVG, il va la substituer par une autre. Dans le cas o` u la m´etrique de la police substitut est diff´erente, cela pourrait conduire `a divers probl`emes lors du rendu, chaque ´el´ement ´etant plac´e dans l’image vectorielle `a l’aide de coordonn´ees absolues. Le choix a donc ´et´e fait de d´efinir une police `a l’int´erieur mˆeme du document SVG. Nous reviendrons sur ce point et sur le choix de la police utilis´ee dans le chapitre 4. Notons aussi qu’il existe de nombreux logiciels permettant de cr´eer et d’´editer du SVG. Pour exemple, soulignons la pr´esence, en Open Source, de Inkscape9 . Dans le domaine propri´etaire, certains logiciels d’Adobe Systems Incorporated10 (Illustrator par exemple) permettent ´egalement l’´edition et la cr´eation de tels documents. Il faut ´egalement savoir que SVG est disponible sur tout type de plate-forme : PC (Linux, Windows), MAC (Mac Os X), PDA, etc. Syst` eme de coordonn´ ees SVG Nous allons parler, dans cette section, d’une particularit´e importante de SVG pour comprendre la suite de ce document. 9 10

http ://www.inkscape.org/ http ://www.adobe.fr/


CHAPITRE 2. ETUDE DU DOMAINE

22

Dans le syst`eme cart´esien, la valeur de la coordonn´ee x augmente de la gauche vers la droite, alors que la valeur de la coordonn´ee y augmente du bas vers le haut du graphique. SVG n’utilise pas cette convention et inverse la direction de l’axe des ordonn´ees. De cette fa¸con, le point (0,0) est plac´e dans le coin sup´erieur gauche et la coordonn´ee y augmente lorsqu’on se d´eplace du haut vers le bas. (0,0)

x

y

Fig. 2.3 – SVG : L’ordonn´ee augmente lorsqu’on se d´eplace du haut vers le bas. SVG dispose cependant d’un outil puissant pour transformer le syst`eme de coordonn´ees et l’adapter aux besoins des applications. Il est donc possible de travailler avec des coordonn´ees locales. El´ ements SVG Il faut se r´ef´erer `a la sp´ecification du W3C pour connaˆıtre tous les d´etails des balises du SVG. Nous allons ici montrer quelques exemples utiles pour la suite de ce document. SVG d´efinit quelques dizaines d’attributs que l’on peut appliquer `a certains ´el´ements. Par exemple : – stroke d´efinit comment le bord d’un objet est peint – fill d´efinit comment le contenu d’un objet est peint On trace une ligne dans un document SVG `a l’aide de la balise <line> ayant au minimum 4 attributs : x1, y1 et x2, y2. Ces attributs correspondent aux coordonn´ees du point de d´epart et du point d’arriv´ee. La balise <text> entraˆıne le rendu d’une chaˆıne de texte. Un texte est un objet graphique : on peut appliquer les fonctions de transformation de syst`eme de coordonn´ees, de peinture, de rognage et de masquage ainsi qu’un style CSS11 . Le texte suit les recommandations g´en´erales des caract`eres XML et n’effectue ni retour `a la ligne ni c´esure automatique. La balise <tspan> permet, par exemple, d’afficher un texte sur plusieurs lignes. Il faut alors pr´ecalculer les retours `a la ligne et employer une seule balise <text> avec un 11

CSS (Cascading Style Sheets : feuilles de style en cascade) est utilis´e pour d´ecrire la pr´esentation d’un document structur´e ´ecrit en HTML ou en XML. Nous utiliserons cette application XML dans la suite de ce document.


CHAPITRE 2. ETUDE DU DOMAINE

23

ou plusieurs fils <tspan> ainsi que des valeurs ad´equates pour les attributs x, y (coordonn´ees absolues12 ) et dx, dy (coordonn´ees relatives13 ). La balise <g> permet de regrouper des ´el´ements qui vont ensemble. Les fils de cette balise h´eritent de ses propri´et´es. En SVG, les longueurs sont indiqu´es soit par un nombre, soit par des unit´es absolues ou relatives. – Les unit´es relatives sont em, ex et px (le pixel14 ). Si aucune unit´e n’est sp´ecifi´ee dans le document SVG, alors c’est le px qui est utilis´e. em et ex sont relatifs `a la police de r´ef´erence : 1 em est ´egal `a la taille de cette police, tandis que 1 ex est la hauteur du x dans cette police. – Les unit´es absolues sont pt (le point), pc (le pica), cm (le centim`etre), mm (le millim`etre) et in (le pouce)15 .

2.2.4

Introduction ` a XSLT (eXtensible Style Language Transformations)

Le langage XSLT apporte de la souplesse aux documents XML en permettant de g´en´erer diverses sorties en divers formats. Il permet de r´eorganiser compl´etement des arbres XML. XSLT permet de rester dans la continuit´e des langages XML.

source XML (dans notre cas : MathML)

processeur XSLT

Résultat (dans notre cas : SVG)

Règles XSLT (objectif de ce mémoire)

Fig. 2.4 – Processeur XSLT On va vu qu’un document XML peut ˆetre repr´esent´e comme une structure arborescente. Ainsi, XSLT permet de transformer les documents XML `a l’aide de feuilles de 12

Les coordonn´ees absolues permettent de positionner un ´el´ement ind´ependamment des autres. Les coordonn´ees relatives indiquent le d´ecalage par rapport ` a un autre ´el´ement. 14 Le pixel est l’unit´e atomique d’une image num´erique. Son nom provient de l’expression anglaise picture element, c’est-` a-dire, ´el´ement d’image. 15 (1 in = 2,54 cm = 25,4 mm = 72 pt = 6 pc) 13


CHAPITRE 2. ETUDE DU DOMAINE

24

style contenant des r`egles appel´ees template rules ou mod`eles de transformation. La structure globale d’un fichier XSLT a la forme : <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> ... <xsl:template match="..."> ... </xsl:template> ... </xsl:stylesheet> XSLT distingue 7 types de noeuds (ou balises) : – La racine du document – Les ´el´ements. – Les attributs. – Les noeuds texte. – Les commentaires <!-- ... -->. – Les instructions de traitement <?...?>. – Les d´efinitions d’espaces de nom. L’´el´ement <xsl:template ...> d´efinit une r`egle de transformation. Son attribut match="..." sp´ecifie les noeuds auxquels s’applique la r`egle : la valeur / d´esigne la racine du document16 . Le langage est bas´e sur des s´elections d’objets typ´es <xsl:apply-templates> auxquels on applique une transformation <xsl:template>. L’attribut select de l’´el´ement <xsl:apply-templates> sp´ecifie l’ensemble des noeuds `a traiter. C’est `a partir de la racine du document d’entr´ee que sont effectu´ees des s´elections puis les transformations. Chaque mod`ele de transformation d´efinit des traitements `a effectuer sur un ´el´ement (noeud ou feuille) de l’arbre source. XSLT permet, entre-autre, de : – Cr´eer de nouveaux ´el´ements dans la cible : <xsl:element>, <xsl:attribute> et <xsl:attribute-set> – G´en´erer du texte : <xsl:text> – G´en´erer des sous-arbres issus de la source : <xsl:copy> – Effectuer des commandes de choix : <xsl:if> et <xsl:choose> 16

Grˆ ace ` a la notation XPath (autre recommandation du W3C), on peut choisir les ´el´ements du document XML sur lesquels s’applique la transformation.


CHAPITRE 2. ETUDE DU DOMAINE

25

– – – – – – –

D´eclarer des variables : <xsl:variable> et <xsl:param> D´eclarer des listes d’objets identifi´es : <xsl:key> Utiliser les listes d’objets identifi´es dans les transformations : <key> Parcourir un ensemble d’´el´ements : <xsl:for-each> Trier un ensemble d’´el´ements : <xsl:sort> Modulariser les feuilles de styles en diff´erents fichiers <xsl:import> et <xsl:include> Modulariser les feuilles de styles en modules de traitement factoris´es : <xsl:call-template> et <xsl:with-param> – Contrˆoler le type d’´ecriture de la sortie <xsl:output>, <xsl:strip-space> et <xsl:preserve-space> XSLT : un langage r´ ecursif ! XSLT ´etant un langage permettant d’appeler r´ecursivement des noeuds d’un arbre et de leur appliquer des r`egles de transformation, c’est r´ecursivement qu’il faut penser. Ce langage de programmation est tr`es particulier et tr`es sp´ecifique au XML. Pour vous donner une id´ee : les variables en XSLT ne peuvent ˆetre modifi´ees une fois d´eclar´ees. On ne peut donc utiliser que des constantes (pas d’incr´ementation possible donc). D`es lors, faire une boucle (avec, par exemple, une variable qui s’incr´emente) en XSLT n’est pas quelque chose d’´evident ! Ce langage permet uniquement des algorithmes r´ecursifs, et non pas it´eratifs. Voici comment, en XSLT, on pourrait simuler une boucle ayant comme arguments $debut et $fin. Ces valeurs, si elles ne sont pas pr´ecis´ees lors de l’appel du mod`ele, sont par d´efaut `a 0. Cette boucle aura pour but d’afficher les nombres compris entre les deux valeurs pass´ees en argument (le premier nombre ´etant compris dans l’affichage, le dernier ne l’est pas). Vous trouvez que le &lt; est bizzare ? Tout ceci reste du XML, et donc le caract`ere < ne peut pas s’´ecrire tel quel. <xsl:template name="boucle"> <xsl:param name="debut" select="0" /> <xsl:param name="fin" select="0" /> <xsl:text>i = </xsl:text> <xsl:value-of select="$debut" /> <xsl:text>; </xsl:text> <xsl:if test="$debut &lt; $fin"> <xsl:call-template name="boucle"> <xsl:with-param name="debut" select="($debut)+1" /> <xsl:with-param name="fin" select="$fin" /> </xsl:call-template> </xsl:if> </xsl:template>


CHAPITRE 2. ETUDE DU DOMAINE

26

A l’aide d’un transformateur XSL (XSLT), on peut modifier la structure d’un document XML. La feuille de style regroupe un ensemble de r`egles de transformations qui vont s’appliquer au document. Un transformateur XSL prend en argument, comme nous l’avons vu, deux fichiers. L’application de la transformation cr´ee un nouveau fichier dont la structure est cr´e´ee selon les r`egles (ou mod`eles) des feuilles de styles, les donn´ees et la structure XML (dans notre cas, du MathML). Rappelons ici, plus en d´etail, la lecture parall`ele des deux fichiers (source et de transformation) dans le cadre d’une transformation via XSLT : – Construire le document d’entr´ee en m´emoire (souvent il est lu sur le disque). Le point de d´epart est la racine du document MathML. – Op´erer une recherche dans l’ensemble des mod`eles XSLT afin d’en trouver un que l’on pourrait appliquer. Si un mod`ele reconnaˆıt la racine, il est appliqu´e. – Le mod`ele essaie ensuite d’appliquer r´ecursivement d’autres mod`eles au reste du document.

2.3

Conclusion

Il a fallu apprendre et maˆıtriser toutes ces applications XML : MathML, SVG, XSLT, XPath, CSS, etc.


Chapitre 3

M´ ethode de production 3.1

Introduction

Ce chapitre a pour but d’expliquer la m´ethode de production, sans entrer dans les d´etails des r`egles sp´ecifiques (de chaque balise de l’arbre d’entr´ee), d’un document SVG `a partir d’un fichier MathML.

3.2 3.2.1

Une solution en deux ´ etapes. Premi` ere id´ ee

La premi`ere id´ee a ´et´e de fonctionner en coordonn´ees relatives, en n’op´erant qu’une seule passe sur le fichier d’entr´ee. Cette solution, une fois r´ealis´ee, pr´esentait de nombreux probl`emes. Dans cette r´ealisation, chaque ´el´ement n’est pas ind´ependant des autres vu que l’on travaille en coordonn´ees relatives. En effet, par exemple, le fait de mettre un caract`ere sous forme d’exposant d´ecalait la suite du document. Le probl`eme vient du fait qu’il n’est pas ais´e de dire au reste du document de revenir s’aligner sur sa ligne de base apr`es avoir op´er´e le rendu l’exposant. Pour tracer une barre fraction dans le document SVG, cela est r´ealis´e via une balise contenant ses coordonn´ees, celles-ci ´etant calcul´ees en fonction de la position courante dans l’image en cours de cr´eation, du contenu du num´erateur et de celui du d´enominateur de la fraction. Or, XSLT ne nous permet pas d’obtenir directement ces donn´ees. Il ´etait ´egalement impossible de connaˆıtre la taille (hauteur et largeur) de la formule `a priori et donc d’initaliser le document SVG `a la bonne taille. Cette m´ethode a donc ´et´e abandonn´ee et son code a ´et´e envoy´e aux oubliettes. Cette m´ethode pr´esentait toute fois certains avantages : nul besoin de se soucier des probl`emes li´es `a la m´etrique de la police utilis´ee (nous y reviendrons plus tard) car les caract`eres ´etaient plac´es l’un `a la suite des autres avec une valeur d’attributs d´ecrivant une position relative. D`es lors, tous les probl`emes de placement dus `a la m´etrique des

27


´ CHAPITRE 3. METHODE DE PRODUCTION

28

polices ´etait r´egl´e par le moteur de rendu SVG.

3.2.2

Une autre id´ ee

Le but final de ce travail est d’obtenir une repr´esentation qui contient l’information `a propos – des glyphes n´ecessaires, – de leur taille, – de leur position dans le document final, – de leurs autres attributs (couleurs, etc.). Pour r´ealiser cette tˆache et ´eviter les probl`emes pr´ecit´es, la deuxi`eme id´ee a ´et´e de proc´eder en deux ´etapes : 1. Transformer l’arbre source MathML en un arbre interm´ediaire de formatage MathML. 2. Parcourir l’arbre interm´ediaire construit et le convertir en un arbre SVG.

arbre MathML

Le parcours de cet arbre produit

un arbre MathML dont chaque balise possède un contexte de formatage

Le parcours de cet arbre produit

un arbre SVG

Fig. 3.1 – La transformation s’op`ere en deux ´etapes

L’id´ee est d’ajouter `a chaque noeud de l’arbre source un contexte de formatage d´efini par un ensemble d’attributs. Ainsi, les ´el´ements de pr´esentation MathML1 peuvent ˆetre vus comme des ´el´ements de formatage ayant un effet sur le document de sortie. Ces ´el´ements d´ependent : – de leur contexte, – de leurs attributs, – de leurs enfants.

3.2.3

Le contexte de formatage

Le contexte de formatage doit donc ˆetre d´efini tel qu’il puisse fournir un certain nombre d’informations : – La taille de la police l`a o` u le formatage est en cours. 1 mi, mn, mi, mtext, ms, mspace, mrow, mstyle, mphantom, merror, mfenced, menclose, msqrt, mroot, mfrac, msub, msup, msubsup, multiscripts, munder, mover, munderover, mtable, mtr, mlabeledtr, mtd, maligngroup, malignmark, maction, etc.


´ CHAPITRE 3. METHODE DE PRODUCTION

29

– La position (relative) courante dans le formatage en cours. D`es lors, nous d´efinissons le contexte de formatage de MathML comme ´etant une structure contenant un certain nombre de champs : Nom size minSize

Valeur par d´efaut

sizeMult

0,71

x y

0 0

Description taille de la police taille minimale de la police (constante d´efinie globalement) nombre par lequel la taille de la police est multipli´e lorsque le niveau est augment´e de 1 (constante d´efinie globalement) position par rapport `a l’origine (abscisse) position par rapport `a l’origine (ordonn´ee)

Tab. 3.1 – Contexte de formatage initial de MathML

3.2.4

Du MathML vers un arbre interm´ ediaire ` a boˆıtes

L’id´ee qui a ´et´e retenue dans le cadre de ce travail a ´et´e de cr´eer un arbre interm´ediaire compos´e (conceptuellement) de boˆıtes. La deuxi`eme ´etape a pour but d’ajuster son formatage et de l’afficher. Cet arbre `a boˆıtes est obtenu, dans ce cas-ci, `a partir de l’arbre source MathML. Reprenons, par exemple, la c´el`ebre formule d’Einstein (E = mc2 ), dont la pr´esentation sous forme d’arbre MathML a ´et´e pr´esent´ee dans le chapitre pr´ec´edent. mrow mi

E

mrow mo

=

mi

m

msup mi

c

mn

2

Fig. 3.2 – Ensemble des boˆıtes correspondant `a la formule E = mc2 On peut voir sur la figure que chaque noeud de l’arbre source MathML correspond a` un noeud de l’arbre interm´ediaire, pouvant maintenant repr´esenter une sorte d’arbre de boˆıtes. La structure hi´erarchique du MathML est ´egalement pr´eserv´ee. Il est heureux qu’il en soit ainsi : le balisage de pr´esentation a ´et´e cr´e´e pour cela. L’objectif de ce premier parcours est donc de d´efinir la position (relative ou absolue), la largeur et la hauteur de ces boˆıtes.


´ CHAPITRE 3. METHODE DE PRODUCTION

3.3

30

G´ en´ eration de l’arbre interm´ ediaire

On peut voir deux types de transformations : – celles qui concernent les feuilles de l’arbre (les seuls ´el´ements pouvant contenir du contenu autre que des attributs), – et celles qui concernent les noeuds poss´edant des fils dans l’arbre MathML.

Fig. 3.3 – Construction r´ecursive de l’arbre interm´ediaire : les noeuds du MathML (ronds) deviennent des boˆıtes (carr´es) de l’arbre interm´ediaire.

3.3.1

Cr´ eation du noeud interm´ ediaire pour une feuille de l’arbre source

Nous allons d´efinir maintenant les op´erations s´equentielles propres `a la cr´eation d’un noeud intermerdiaire pour une feuille de l’arbre MathML d’entr´ee. 1. R´ecup´erer le contexte du noeud parent. 2. D´eclarer dans une variable le nom du noeud local. 3. Placer dans une variable la longueur de la chaˆıne de caract`eres. 4. Modifier le contexte re¸cu selon le type de noeud courant. 5. Traiter les attributs de la feuille de l’arbre. 6. Calculer la hauteur et la largeur de la boˆıte entourant ce(s) caract`ere(s). 7. Sauver le nouveau contexte et les attributs dans l’arbre interm´ediaire.


´ CHAPITRE 3. METHODE DE PRODUCTION

3.3.2

31

Description des op´ erations

Dans les cas triviaux, seul le code est donn´e. Dans des cas plus complexes, une br`eve explication est donn´ee. R´ ecup´ erer le contexte du noeud parent : <xsl:param name="size"/> <xsl:param name="x"/> <xsl:param name="y"/> D´ eclarer dans une variable le nom du noeud local : <xsl:variable name="localName"> <xsl:value-of select="local-name(.)"/> </xsl:variable> Placer dans une variable la longueur de la chaˆıne de caract` eres : <xsl:variable name="contentLen"> <xsl:value-of select="string-length(.)"/> </xsl:variable> Modifier le contexte re¸ cu selon le type de noeud courant, traiter les attributs de la feuille de l’arbre, calculer la hauteur et la largeur de la boˆıte entourant ce(s) caract` ere(s) : Par exemple, pour introduire ce point, notons que la police peut-ˆetre sp´ecifi´ee comme devant ˆetre ’normale’ pour les nombres, alors qu’elle doit passer en mode ’italique’, dans certains cas, pour une lettre de la formule. La largeur ainsi que la hauteur des boˆıtes varie selon la m´etrique de la police repr´esentant le caract`ere. Afin de permettre un meilleur rendu visuel, le caract`ere 2 poss`ede une taille inf´erieure au C, pr´ecis´ement 0.71 ∗ cHeight o` u cHeight repr´esente ici le hauteur du caract`ere C. Nous d´evelopperons ces points, pr´ecis´ement, dans le chapitre 5. Sauver le nouveau contexte et les attributs dans l’arbre interm´ ediaire : <xsl:copy> <xsl:copy-of select="@*"/> <xsl:attribute name="t:X"><xsl:value-of select="$x"/> </xsl:attribute> <xsl:attribute name="t:Y"><xsl:value-of select="$y"/></xsl:attribute> <xsl:attribute name="t:FONTSIZE"><xsl:value-of select="$size"/></xsl:attribute> ... </xsl:copy>


´ CHAPITRE 3. METHODE DE PRODUCTION

32

Si l’on reprend notre figure pr´ec´edente, nous venons de sauver des attributs pour les caract`eres E, =, m, c et 2 de la formule d’Einstein.

3.3.3

Cr´ eation d’une boˆıte pour un noeud poss´ edant un ou plusieurs fils

Nous allons maintenant devoir calculer la taille de boˆıtes entourant (autrement dit, ´etant noeud parent dans l’arbre hi´erarchique) les boˆıtes cr´e´ees. Cela se fait r´ecursivement `a partir des boˆıtes cr´e´ees pour les noeuds feuilles. 1. R´ecup´erer le contexte re¸cu du noeud parent. 2. Construire les boˆıtes des fils en leur fournissant un contexte sp´ecifique selon la nature du noeud courant2 . Cr´eer un pointeur rep´erant les boˆıtes des fils. 3. Regarder si l’´el´ement contient des attributs sp´eciaux. 4. Calculer la hauteur et la largeur de la boˆıte entourant les fils. 5. Garder, si besoin, des attributs permettant d’am´eliorer le placement des fils. 6. Sauver le nouveau contexte et les attributs dans l’arbre interm´ediaire. Dans l’arbre interm´ediaire, nous avons donc sauv´e les attributs de la boˆıte entourant le c et le 2 (balise <msup>) ainsi que les attributs des deux balises <mrow> contenus dans le fichier MathML. La largeur et la hauteur de la balise <mrow> entourant toute la formule permettent de connaˆıtre la taille de l’image de sortie `a g´en´erer. La majorit´e de ces op´erations ont ´et´e expliqu´ees au point pr´ec´edent. Les ´etapes non expliqu´ees dans cette section sont celles qui concernent la construction de chaque balise de l’arbre source MathML. Chaque balise poss`ede sa propre sp´ecification et donc, une transformation bien pr´ecise. Cette construction est le sujet du chapitre 5. Nous y d´etaillerons donc ces op´erations. Remarque ` a propos de la construction On voit donc tout le caract`ere r´ecursif de la construction : – on construit les ´elements fils ; – une fois construits, on peut acc´eder `a l’information calcul´ee contenue `a l’int´erieur de ceux-ci ; – une fois cet arbre interm´ediaire construit, nous avons dans la racine de l’arbre (et dans l’arbre) toutes les informations n´ecessaires `a la g´en´eration du fichier de sortie SVG.


´ CHAPITRE 3. METHODE DE PRODUCTION

33

math

svg

mrow

mi (E)

g

mo (=)

mrow text (E) mi (m)

text (=)

text (m)

text (c)

text (2)

msup

mi (c)

mn (2)

Fig. 3.4 – E = mc2 . De l’arbre interm´ediaire vers le SVG. Parcours niveau par niveau en partant de la racine en cr´eant les noeuds dans l’arbre r´esultat.

3.4

De l’arbre interm´ ediaire au SVG

Le parcours de l’arbre interm´ediaire se fait lui aussi r´ecursivement en partant de la racine du document. Chaque noeud parent op`ere son propre rendu si besoin et demande `a son ou ses fils (s’il en poss`ede) d’effectuer lui (eux) aussi son rendu vers le document SVG. Chaque noeud poss`ede un certain nombre d’attributs permettant de produire son (leur) rendu de mani`ere appropri´ee. Ces appels r´ecursifs, concernant ce parcours final, se font `a l’aide de param`etres suppl´ementaires, qui permettent d’ajuster, si besoin en est, la position (coordonn´ees x,y) du noeud appel´e. En effet, certaines coordonn´ees relatives doivent devenir absolues : nous reviendrons ´egalement sur ce point dans le chapitre 5.

3.5

Rapidit´ e de la transformation

La complexit´e de l’algorithme op´erant la transformation se pose assez vite. Le style de programmation XSLT ´etant fortement impos´e, il est difficile d’op´erer des optimisations telles que l’ont pourrait op´erer dans un language it´eratif classique. L’optimisation d’une feuille de transformation XSLT depend surtout du transformateur : certains sont plus rapides sur certaines op´erations. Le complexit´e3 de la transformation d´ecrite dans ces pages est de l’ordre N (N ´etant 2 Par exemple, pour la balise <msup> : la r`egle est de construire le fils ` a gauche ’normalement’ et d’ensuite placer le fils ` a droite selon la largeur prise par le fils ` a gauche et selon la taille de la police du fils ` a gauche) 3 L’analyse de la complexit´e consiste ` a d´eterminer une fonction associant un coˆ ut (en unit´e de temps


´ CHAPITRE 3. METHODE DE PRODUCTION

34

le nombre de noeuds faisant partie de l’arbre d’entr´ee MathML). En effet, la construction du document final se fait lin´eairement.

3.6

Construction de l’arbre en une seule passe

La deuxi`eme passe ayant pour but principal de transformer des coordonn´ees relatives en coordonn´ees absolues, le choix aurait pu ˆetre fait de g´en´erer l’arbre SVG en une seule fois, en pla¸cant dans l’arbre de sortie des valeurs permettant de d´eplacer les ´el´ements et de laisser le calcul des coordonn´ees absolues au moteur de rendu SVG. Cette solution aurait men´e `a un document de sortie moins propre car augment´e de nombreux nouveaux noeuds4 . Le choix a ´et´e d’int´egrer tous ces calculs directement dans la m´ethode de production. Cette solution en deux ´etapes permettait surtout, lors de son ´elaboration, de pr´esenter une solution plus claire en s´eparant les diff´erents probl`emes.

3.7

Conclusion

Les ´el´ements de mise en forme de formules math´ematiques font appel `a de nombreux concepts vari´es et parfois complexes. Cette solution permet de rendre le programme ´evolutif. Pour am´eliorer un rendu d’une balise en particulier, il suffit d’am´eliorer le mod`ele s’occupant de cr´eer le noeud interm´ediaire, et d’affiner de mˆeme, la r`egle correspondante permettant d’ajouter un ou plusieurs noeuds dans l’arbre final. Le concept de contexte de formatage permet de r´epondre `a ces imp´eratifs car un noeud consid`ere ses descendants comme ´etant des boˆıtes et ce, quels que soient le type de formules contenues dans ses descendants.

ou de m´emoire) ` a chaque entr´ee soumise ` a l’algorithme. 4 Cet argument est discutable.


Chapitre 4

Particularit´ es du rendu de formules math´ ematiques Nous allons, au cours de ce chapitre, discuter de certains probl`emes li´es `a la qualit´e du rendu de formules math´ematiques : – Le choix de la police utilis´ee. – Le probl`eme d’ajustement optique.

4.1

Le choix de la police utilis´ ee

Tous les ´el´ements d’une image vectorielle produite dans le cadre de ce travail sont plac´es `a l’aide de coordonn´ees absolues. Il est `a noter que le caract`ere a poss`ede une plus petite largueur que le caract`ere m dans la majorit´e des polices. D`es lors, le placement des ´el´ements est fortement d´ependant de la police utilis´ee (et donc de la m´etrique de celle-ci). Or, dans un document SVG, on peut sp´ecifier un type de police mais dans le cas o` u celle-ci n’est pas install´ee sur le syst`eme, une police de substitution sera utilis´ee. Cela n’est pas sans poser des probl`emes dans le cadre de ce travail. Il fallait donc chercher et trouver une police install´ee sur la majorit´e des syst`emes et qui disposait, de plus, d’un jeu de caract`eres suffisament ´etendu afin de permettre la repr´esentation de tous les caract`eres math´ematiques. Apr`es diverses investigations, nous avons d´ecouvert que SVG disposait d’un syst`eme permettant de d´efinir une police de caract`ere `a l’int´erieur mˆeme du document. D`es lors, toute personne disposant d’un moteur de rendu SVG disposera de la mˆeme police : quel que soit le syst`eme d’exploitation utilis´e, quel que soit les polices install´ees sur celui-ci. L’´etape suivante fut donc de choisir la police `a d´efinir dans le SVG produit. Beaucoup de documents scientifiques, sp´ecialement pour ce qui concerne la physique et les math´ematiques, sont r´edig´es `a l’aide de TEX . Ce dernier joue un rˆole dominant lors de la publication de documents scientifiques. Sa fa¸con de formater des formules math´ematiques est un mod`ele reconnu. Nous avons donc essay´e, via ce travail, de nous 35


´ DU RENDU DE FORMULES MATHEMATIQUES36 ´ CHAPITRE 4. PARTICULARITES rapprocher le plus pr`es possible de la qualit´e de rendu des formules math´ematiques de TEX . Il fallait donc trouver le moyen de d´efinir les polices TEX `a l’int´erieur du document SVG. Apr`es quelques recherches, nous avons trouv´e un article r´epondant au probl`eme : TEX SVG, Fonts [23] qui explique comment convertir une police TEX vers le SVG. Il suffisait donc de reprendre ces r´esultats et de les inclure dans ce travail. Ce choix a un coˆ ut au niveau de la taille du fichier SVG final : la place occup´ee sur le disque dur par la police est inf´erieure `a 300 kilo-octets. Celle-ci est automatiquement inclue dans chaque document SVG produit par ce travail. Cependant, ce coˆ ut est discutable : on pourrait d´efinir `a l’int´erieur du document produit uniquement les caract`eres correpondants aux glyphes utilis´es dans la formule produite ; on pourrait compresser le document SVG et partager un document de type SVGz (fichier de type SVG compress´e). D`es lors, ce coˆ ut devient n´egligeable. Il existe bien entendu des polices avec largeur fixe, ce qui aurait pu faciliter le probl`eme dans le cas o` u l’on aurait choisit une police de ce type pr´esente sur la majorit´e des syst`emes. La largeur d’un caract`ere n’est pas tellement un obstacle ´etant donn´e que l’on dipose de ces donn´ees dans le cas o` u nous d´efinissons la police `a l’int´erieur du document car ces valeurs sont accessibles (car pr´esentes dans la d´efinition du caract`ere). Exemple de d´ efinition d’un glyphe dans un document SVG Le caract`ere d´ecrit ci-dessous, en XML directement dans le document SVG, est le Theta (Θ) de TEX (dans la police CMR) : <defs><font id="CMR"><font-face font-family="CMR"/> ... <glyph unicode="&#xE002;" glyph-name="Theta" horiz-adv-x="777.8"> <path style="fill:#000000; fill-rule=evenodd; stroke:none" d="M 56 665 339 c 0 204 -151 366 -333 366 c -179 0 -332 -160 -332 -366 c 0 154 -361 332 -361 c 182 0 333 159 333 361 z M 721 339 m -332 -338 c -99 0 -236 86 -236 338 c 0 257 139 344 235 c 101 0 236 -91 236 -344 c 0 -255 -141 -338 -235 -338 z M 389 1 m 178 413 h -25 v -34 h -307 v 34 h -25 v -144 h 25 v 34 h v -34 h 25 z"/> </glyph> ... </font-face></font></defs>

0 m -205 344 307

On remarque que la d´efinition de la balise glyph contient un attribut donnant une information `a propos de la largeur du glyphe (horiz-adv-x ). Cette valeur a ´et´e utilis´ee dans ce travail afin de sp´ecifier la largeur d’un ´el´ement feuille de notre arbre interm´ediaire. Il


´ DU RENDU DE FORMULES MATHEMATIQUES37 ´ CHAPITRE 4. PARTICULARITES faudrait, pour bien faire, connaˆıtre ´egalement pr´ecis´ement la hauteur de la boˆıte. Cela peut se faire en se servant du fichier de m´etrique, d´efini par Don Knuth 1 , correspondant `a la police de caract`ere. Ce dernier ´etant sous forme binaire, il n’est pas facile de r´ecup´erer ces informations. De plus, cette description semble aujourd’hui assez r´evolue ´etant donn´e l’existence de XML. Luca Padovani a trouv´e une r´eponse `a ce probl`eme et a ´ecrit un petit programme permettant la transformation de ces fichiers binaires en document XML. La transformation ainsi que les fichiers XML g´en´er´es sont disponibles sur internet2 . L’int´egration de ces valeurs reste tout `a fait possible dans la structure actuelle des mod`eles XSLT.

4.2

Le probl` eme d’ajustement optique

Parlons maintenant d’une des sp´ecificit´es des formules math´ematiques afin de comprendre mieux en quoi la recherche d’une solution la plus optimale possible n’est pas une chose ais´ee. Une formule math´ematique est compos´ee de diff´erentes lettres provenant P de diff´erentes familles (a, α, . . .) ainsi que de symboles math´ematiques sp´ecifiques (∞, , . . .). Ces ´el´ements ont des tailles diff´erentes. Par exemple, dans l’expression c2 , si c poss`ede une taille de 12 points, alors le 2 devrait avoir une taille de 10 points. De plus, des r`egles concernant les fractions, d´eterminants, etc. sont n´ecessaires. Il en est de mˆeme d’un ensemble de symboles ayant une taille variable : le signe de l’intr´egrale, le signe de sommation, les parenth`eses, le signe de la racine carr´ee, etc. Certains ´el´ements suivent des r`egles d’ajustement optique. Par exemple, certains grands symboles sont compos´e `a l’aide de morceaux plus petits. En effet, une parenth`ese devrait, pour bien faire, ˆetre constitu´ee d’un coin arrondi dans le haut de sa repr´esentation, d’un autre coin arrondi dans le bas de sa repr´esentation tandis que la jonction entre les deux coins se fait `a l’aide d’un ou plusieurs segment(s) de droite. Les parenth`eses doivent ajuster leur taille en fonction du contenu qu’elles englobent.

Fig. 4.1 – Les symboles dont la taille est variable sont g´en´eralement dessin´es `a l’aide de symboles compos´es.

1 2

Le p`ere de TEX . http ://www.cs.unibo.it/ lpadovan/software/libxtfm/xtfm.html


Chapitre 5

R` egles de transformations 5.1

Introduction

Ce chapitre est consacr´e `a l’´etude, assez technique, de la transformation pour chaque balise MathML du document. Pour chaque balise de pr´esentation d’un document MathML, nous allons d´efinir : – Des r`egles concernant la cr´eation du noeud interm´ediaire. – Des r`egles concernant la g´en´eration du noeud dans le document SVG de sortie. Nous avons expliqu´e, dans le chapitre 3, comment les diff´erents arbres ´etaient parcourus. Nous allons d´ecrire, dans cette partie, pour chaque noeud de l’arbre MathML source rencontr´e par les parcours pr´ecit´es, leurs mod`eles de transformation.

5.2

La racine du document MathML

Lorsque l’on fournit, au transformateur, des mod`eles de transformations ainsi qu’un document source, il va d’abord regarder `a appliquer la r`egle servant de d´epart : celle consacr´ee au traitement du noeud racine de l’arbre XML source. <xsl:template match="/"> ... </xsl:template> Cette r`egle est donc notre point de d´epart : c’est la premi`ere appel´ee par le transformateur XSLT !

38


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

39

pointeur

math

svg g

font

sous-arbre SVG (rendu de la formule) Arbre MathML

Arbre intermédiaire

Arbre SVG

Fig. 5.1 – Mod`ele s’appliquant `a la racine de l’arbre MathML

Op´ erations r´ ealis´ ees s´ equentiellement par ce mod` ele – Lancer la construction1 de l’arbre interm´ediaire. Placer un pointeur sur la racine de l’arbre interm´ediaire construit2 . – A l’aide du pointeur du point pr´ec´edent, regarder quelle est la largeur ainsi que la hauteur de la boˆıte entourant la totalit´e de la formule (dans le noeud racine de l’arbre interm´ediaire). – G´en´erer la racine de l’arbre SVG (balise <SVG>) en sp´ecifiant sa taille (largeur et hauteur) `a l’aide des donn´ees r´ecolt´ees au point pr´ec´edent. – Ajouter un noeud fils `a la racine (balise <g> du SVG) contenant des attributs d’ajustement visuel. Tous les fils de ce noeud h´eritent des propri´et´es de celui-ci3 . – D´efinir la police de caract`eres comme ´etant fils direct de l’arbre SVG. – Construire le sous-arbre SVG en parcourant l’arbre interm´ediaire construit. Ce sous-arbre SVG devient descendant de la balise <g> construite au point n˚3.

5.3

mi

Sp´ ecification du W3C concernant le rendu Dans la majorit´e des cas, le contenu d’un ´el´ement mi repr´esentera un identifiant math´ematique tel qu’une variable ou un nom de fonction. Un moteur de rendu graphique typique rendrait un ´el´ement mi selon les caract`eres de son contenu, sans expacement suppl´ementaire autour des caract`eres (sauf l’espacement associ´e aux ´el´ements voisins). La valeur par d´efaut de ses attributs mathvariant et fontstyle serait (typiquement) normal (non-pench´e), `a moins que le contenu ne soit qu’un seul caract`ere, auquel cas ce 1

Par construire ou construction, on sous-entend l’appel r´ecursif correspondant ` a la premi`ere ´etape (d´ecrite dans le chapitre pr´ecedent) de la m´ethode de production. 2 C’est du XSLT : il faut, bien entendu, penser r´ecursivement. 3 Nous y sp´ecifions donc, par exemple, la police de caract`ere utilis´ee par les balises <text> fils de cet ´el´ement.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

40

serait la valeur italic.

R` egle pour la construction de l’arbre interm´ ediaire – Compter le nombre de caract`eres contenus dans la balise. – Sauver le contexte de formatage (attributs concernant la balise) dans l’arbre interm´ediaire. Le calcul des attributs width et height (largueur et hauteur) de la boˆıte entourant le(s) caract`ere(s) d´epend du glyphe repr´esentant celui-ci (ceux-ci) ainsi que du nombre de caract`eres contenus dans l’´el´ement.

R` egle pour la construction de l’arbre final – Calculer la position absolue de l’´el´ement en fonction des valeurs re¸cues en argument lors de l’appel de cette r`egle ainsi que du contexte de formatage propre `a l’´el´ement. – Construire le noeud dans l’arbre SVG `a l’aide d’une balise de type <text> compl´et´ee d’attributs d´ependant du contexte de formatage, de la sp´ecification du MathML et des attributs sp´ecifi´es dans l’arbre MathML source.

<mi>a</mi>

a contexte de formatage

<mi>b</mi>

b contexte de formatage

<text x="20" y="20" font-size="8">a</text> + attribut pour rendu en italique

<text x="20" y="20" font-size="8">b</text> + attribut pour rendu en italique

Fig. 5.2 – Exemples simples de transformation d’un ´el´ement ’mi’.

5.4

mn, mtext

Sp´ ecification du W3C concernant le rendu mn : Un ´el´ement mn repr´esente un « litt´eral num´erique » ou d’autres donn´ees qui devraient ˆetre rendues comme litt´eral num´erique. G´en´eralement parlant, un litt´eral num´erique est une s´equence de chiffres, incluant ´eventuellement un point d´ecimal, repr´esentant un entier non sign´e ou un nombre r´eel.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

41

Les r`egles de transformations d’une balise mn sont identiques `a celles concernant une balise mi. mtext : Un ´el´ement mtext s’utilise pour repr´esenter un texte arbitraire devant ˆetre rendu en tant que tel. En g´en´eral, l’´el´ement mtext est destin´e `a indiquer un commentaire. Les r`egles de transformations d’une balise mtext sont identiques `a celles concernant une balise mi.

5.5

ms

Sp´ ecification du W3C concernant le rendu L’´el´ement ms s’utilise pour repr´esenter des chaˆınes litt´erales dans les expressions destin´ees `a ˆetre interpr´et´ees par des syst`emes de calcul alg´ebrique ou d’autres syst`emes contenant des langages de programmation. Par d´efaut, les chaˆınes litt´erales sont affich´ees entour´ees par des guillemets doubles. Comme tous les ´el´ements atomiques, l’´el´ement ms rogne et fusionne les blancs de son contenu. Pour les moteurs de rendu visuel, le contenu d’un ´el´ement ms est typiquement rendu sans espacement suppl´ementaire rajout´e autour de la chaˆıne et avec un caract`ere guillemet au d´ebut et `a la fin de celle-ci. Par d´efaut, les caract`eres guillemets de gauche et de droite sont tous deux des guillemets doubles standard &quot;. Cependant, on peut remplacer ces caract`eres par les attributs lquote et rquote respectivement.

R` egle pour la construction de l’arbre interm´ ediaire – Compter le nombre de caract`eres contenus dans la balise. – Sauver le contexte de formatage (attributs concernant la balise) dans l’arbre interm´ediaire. Le calcul des attributs width et height (largueur et hauteur) de la boˆıte entourant le(s) caract`ere(s) d´epend du glyphe repr´esentant celui-ci (ceux-ci) ainsi que du nombre de caract`eres contenus dans l’´el´ement. La largeur de la boˆıte doit ˆetre augment´ee proportionnellement `a la largeur des boˆıtes de chacun des deux guillemets dispos´es de part et d’autre de la chaˆıne litt´erale contenue dans la balise. Ces guillements h´eritent du contexte de formatage courant.

R` egle pour la construction de l’arbre final – Calculer la position absolue de l’´el´ement en fonction des valeurs re¸cues en argument lors de l’appel de cette r`egle ainsi que du contexte de formatage propre `a l’´el´ement. Le calcul de la position absolue des ´el´ements d´epend ´egalement des guillemets `a placer de part et d’autre de la chaˆıne litt´erale (dans ce cas, il faut avancer tout


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

42

le contenu de la chaˆıne en augmentant la valeur de l’abscisse de chaque ´el´ement atomique afin de placer sur leur gauche, un guillemet : l’autre guillement prend la place restante `a la fin de la boˆıte courante). – Construire le noeud dans l’arbre SVG `a l’aide d’une balise de type <text> compl´et´ee d’attributs d´ependant du contexte de formatage, de la sp´ecification du MathML et des attributs sp´ecifi´es dans l’arbre MathML source.

5.6

mspace

Sp´ ecification du W3C concernant le rendu Un ´el´ement vide mspace repr´esente un espace de n’importe quelle taille voulue, r´egl´ee par ses attributs. On peut aussi l’utiliser pour sugg´erer des sauts de ligne `a un moteur de rendu visuel. Remarquez que les valeurs par d´efaut des attributs ont ´et´e choisies pour typiquement n’avoir aucun effet sur le rendu. Ainsi, l’´el´ement mspace est g´en´eralement employ´e avec une ou plusieurs valeurs d’attribut explicitement sp´ecifi´ees.

R` egle pour la construction de l’arbre interm´ ediaire – Calculer la taille de la boˆıte en fonction des attributs de l’´el´ement. – Sauver le contexte de formatage (attributs concernant la balise) dans l’arbre interm´ediaire.

R` egle pour la construction de l’arbre final Aucun rendu concernant cet ´el´ement.

5.7

mo

Sp´ ecification du W3C concernant le rendu Un ´el´ement mo repr´esente un op´erateur ou toute autre chose qui devrait se rendre comme un op´erateur. En g´en´eral, les conventions de notation pour les op´erateurs math´ematiques sont assez compliqu´ees, c’est pourquoi MathML offre un m´ecanisme relativement sophistiqu´e pour la sp´ecification du comportement de rendu d’un ´el´ement mo. Les op´erateurs repr´esentent un type particulier d’´el´ement atomique. Les deux diff´erences par rapport aux autres ´el´ements atomiques sont : – Les op´erateurs ont de l’espace autour d’eux. Cet espace est d´etermin´e par la forme de l’op´erateur. Les r`egles d´etaill´ees pour la d´etermination de l’espacement de l’op´erateur dans les rendus visuels sont d´ecrites dans la sp´ecification du W3C. – Les op´erateurs peuvent devoir ˆetre ´etir´es `a une taille particuli`ere.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

43

La majorit´e de ces ´el´ements prennent leur valeur depuis le dictionnaire des op´erateurs 4 . Le contexte de formatage de l’´el´ement est donc d´etermin´e par ces r`egles qui doivent ˆetre ins´er´ees dans le cadre de la transformation. Il reste un travail de d´eveloppement `a faire afin d’aboutir `a une solution claire et compl`ete pour ce cas. Nous allons donc juste ´enum´erer les diff´erents probl`emes `a r´esoudre concernant le rendu des op´erateurs MathML.

Dessin des parenthèses à l'aide des éléments les constituants

(

)

Construction actuelle

Etirement des boîtes mo correspondant aux parenthèses (cas à réaliser)

Fig. 5.3 – Exemple de redimensionnement d’un type d’´el´ement mo.

Le probl`eme principal provient du mode de parcours de l’arbre initial. En effet, prenons, par exemple, le cas de parenth`eses englobant une matrice. La parenth`ese gauche sera la premi`ere construite. Autrement dit, la taille de sa boˆıte sera calcul´ee avant que le calcul du contenu qu’elle entoure. Il faudrait donc pr´evoir un m´ecanisme qui permet de redimensionner les boˆıtes correspondant aux parenth`eses, en fonction de ce qu’elles englobent. Une solution g´en´erale pourrait ˆetre d’inf´erer une balise de type mrow pour le contenu ´etant `a l’int´erieur de parenth`eses. D`es lors, lorsque que cette boˆıte est calcul´ee, il faudrait venir placer de nouveaux arttributs dans les boˆıtes correspondant aux parenth`eses, afin de, par exemple, en augmenter leur hauteur (afin que celle-ci corresponde `a la hauteur de la boˆıte calcul´ee). 4

De nombreux symboles math´ematiques, tels qu’un signe d’int´egration, un signe plus ou une parenth`ese, ont un emploi en notation bien ´etabli, pr´evisible et traditionnel. Typiquement, cet emploi se r´esume ` a certaines valeurs d’attribut par d´efaut pour les ´el´ements mo ayant des contenus sp´ecifiques et un attribut form sp´ecifique. Comme ces valeurs par d´efaut varient d’un symbole ` a l’autre, MathML anticipe que les moteurs de rendu (pour le MathML) auront un dictionnaire des op´erateurs des attributs par d´efaut pour les ´el´ements mo (voir l’Appendice F de la sp´ecification MathML par le W3C) index´e par le contenu de chaque ´el´ement mo et attribut form.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

44

Le dessin et le placement des caract`eres consitutant les parenth`eses se ferait alors lors de la deuxi`eme passe. Ces diff´erents ´el´ements seraient d`es lors plac´es en fonction de la taille des boˆıtes correspondant `a celles-ci. Ici encore, la construction de l’arbre en une une seule passe rendrait moins claire la solution ´elabor´ee. Un gros travail de d´eveloppement reste `a faire concernant ce point.

5.8

mglyph

Sp´ ecification du W3C concernant le rendu L’´el´ement mglyph est le moyen par lequel les utilisateurs peuvent acc´eder directement aux glyphes des caract`eres qui ne sont pas d´efinis par Unicode ou qui sont inconnus du moteur de rendu. Les auteurs devraient avoir `a l’esprit que le rendu exige les polices appel´ees par l’´el´ement mglyph, auxquelles le moteur de rendu MathML peut ne pas avoir acc`es ou lesquelles ne sont pas g´er´ees par le syst`eme sur lequel tourne le moteur de rendu. Pour ces raisons, on encourage les auteurs `a n’utiliser l’´el´ement mglyph que quand cela est absolument n´ecessaire et pas pour des effets de style. Aucune gestion dans ce travail de ce type de balise `a l’heure actuelle.

5.9

msub

Sp´ ecification du W3C concernant le rendu La syntaxe de l’´el´ement msub est ; <msub> base ´ ecriture_en_lettres_inf´ erieures </msub> Dans le cas o` u la base serait x et le deuxi`eme fils serait i, le rendu devrait ˆetre xi .

R` egle pour la construction de l’arbre interm´ ediaire – – – – –

Construire la base (fils `a gauche) en l’appellant avec le contexte courant. R´ecup´erer la hauteur et la largeur de la boˆıte du fils `a gauche construite. Construire le fils `a droite avec le contexte courant modifi´e. Calculer la hauteur et la largueur de la boite courante. Sauver le contexte modifi´e `a l’aide des valeurs calcul´ees.

R` egle pour la construction de l’arbre final Demander le rendu des fils de l’´el´ement.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

(0,0)

y

45

x

xi

Fig. 5.4 – Sch´ema aidant au calcul de la taille de la boˆıte de msub.

5.10

msup

Cette balise est fort semblable `a msub. Le premier fils est ´ecrit normalement, le second est ´ecrit en lettres sup´erieures (en exposant). D`es lors, si le premier argument est x et si le deuxi`eme est 2, alors le rendu sera x2 . Les r`egles sont les mˆemes que pour msub hormis pour le contexte envoy´e au second fils dans le cadre des r`egles permettant la construction de l’arbre interm´ediaire : le param`etre y est diff´erent. (0,0)

y

x

x

2

Fig. 5.5 – Sch´ema aidant au calcul de la taille de la boˆıte de msup. Il faut pr´evoir, dans ce cas, un m´ecanisme permettant de placer le second fils de telle mani`ere que le fond de sa boˆıte co¨ıncide `a la valeur correspondant `a environ 71% de la hauteur de la boˆıte du premier fils.

5.11

msubsup

La balise msubsup est un m´elange de msub et de msup. La balise poss`ede donc 3 fils. Le premier fils est construit avec le contexte courant. Le second est construit avec le contexte d´ecrit pour la deuxi`eme fils de msub tandis que le troisi`eme fils est appel´e avec le contexte utilis´e pour la deuxi`eme fils de msup. Le calcul de la taille de la boˆıte de l’´el´ement est quant `a lui un rien diff´erent.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

(0,0)

y

46

x

x

10 i

x

2 x+i

Fig. 5.6 – Sch´ema aidant au calcul de la taille de la boˆıte de msubsup.

5.12

msqrt

Sp´ ecification du W3C concernant le rendu Cet ´el´ement construit un radical. L’´el´ement msqrt s’utilise pour les racines carr´ees. Il accepte n’importe quel nombre d’arguments ; si ce nombre n’est pas ´egal `a 1, son contenu est trait´e comme un seul ´el´ement mrow inf´er´e contenant ses arguments.

R` egle pour la construction de l’arbre interm´ ediaire – Construire les fils en appelant le mod`ele s’occupant de g´erer les mrow. – Calculer la taille de la boˆıte courante comme ayant la mˆeme hauteur que la boˆıte cr´e´ee par l’appel pr´ec´edent mais ayant un largeur plus grande afin de laisser la place, `a gauche, pour le dessin de l’insigne radical. Pour bien faire, il faudrait ´egalement ´etirer un tout petit peu la boˆıte en hauteur.

R` egle pour la construction de l’arbre final – D´eplacer vers la droite tout le contenu du (des) fils du radical en demandant leur rendu. – Dessiner le radical.

Le dessin du radical Pour simplifier le rendu, la solution choisie a ´et´e de dessiner le radical `a l’aide de 4 lignes, en calculant les 5 coordonn´ees permettant le dessin de celui-ci. Ce rendu n’est donc certainement pas optimal. En effet, pour ˆetre optimal, il faudrait que l’on utilise le caract`ere correspondant au radical (d´efini dans la police utilis´ee) et d’ensuite tracer les lignes suppl´ementaire permettant de terminer le dessin. Or, pour se faire, il faut d´efinir la taille de la police correspondant au caract`ere et calculer les coordonn´ees permettant la fin du dessin, via des balises line. Un autre probl`eme se pose : il faut choisir une bonne valeur pour l’´epaisseur de la ligne prolongant le caract`ere pr´ecit´e afin que le radical et la ligne se confondent. Le calcul des 5 coordonn´ees permet, dans une premier temps, d’´eviter ces calculs et de fournir, rapidement, une rendu visuel basique.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

47

msqrt mrow inféré

dessin du radical : traçage de lignes via 4 balises <line> msqrt mrow inféré

Fig. 5.7 – Dessin du radical.

5.13

mroot

Sp´ ecification du W3C concernant le rendu Cet ´el´ement construit ´egalement un radical. L’´el´ement mroot s’utilise pour dessiner des radicaux avec des indices, par exemple, une racine cubique. L’´el´ement mroot requiert exactement deux arguments.

R` egle pour la construction de l’arbre interm´ ediaire – Construire le fils a` gauche et le fils `a droite. – Calculer la taille de la boˆıte courante. Ces calculs, `a l’heure actuelle, n’ont pas encore ´et´e effectu´es. Il faut d´efinir le placement des fils l’un par rapport `a l’autre et calculer la taille de la boˆıte entourant ces deux boˆıtes.

R` egle pour la construction de l’arbre final Il faut appeler les deux fils en leur sp´ecifiant des valeurs de d´eplacement x et y concernant le placement calcul´e lors de la construction pr´ec´edente. Il faut `a nouveau calculer les 5 coordonn´ees correspondant au dessin de la racine. Cette balise n’ayant pas ´et´e impl´ement´ee `a l’heure actuelle, nous ne d´etaillerons pas plus ce point.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

fils à gauche

48

fils à droite

mroot fils à droite fils à gauche

Fig. 5.8 – Sch´ema aidant au calcul de la taille de la boˆıte de mroot.

5.14

mfrac

Sp´ ecification du W3C concernant le rendu L’´el´ement mfrac s’utilise pour des fractions.

R` egle pour la construction de l’arbre interm´ ediaire – Construire le fils `a gauche et le fils `a droite. Le contexte pass´e en param`etre est le courant avec quelques modifications. – Calculer la taille de la boˆıte courante.

Calcul de la boˆıte courante numérateur (fils à gauche)

dénominateur (fils à droite)

cas n ° 1 (largeur) numérateur > dénominateur cas n°2 (largeur) numérateur < dénominateur hauteur (height)

cas n°3 (largeur) numérateur = dénominateur

calcul de la boîte dans le cas n°1

largeur (width)

Fig. 5.9 – Sch´ema aidant au calcul de la taille de la boˆıte de mfrac. La hauteur de la boˆıte mfrac se calcule comme suit :


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

49

"hauteur" := "hauteur 1er fils" + "hauteur du deuxi` eme fils" + "espace entre les deux bo^ ıtes pour le dessin de la barre de fraction"; La largeur, quant `a elle, se calcule en prenant pour valeur, la plus grande valeur de largeur.

R` egle pour la construction de l’arbre final Il faut, dans ce cas, si aucun n’attribut n’est sp´ecifi´e, que le plus petit des deux soit centr´e par rapport `a l’autre. Ce centrage se fait en pla¸cant des attributs consacr´es `a cela dans les noeuds interm´ediaires lors de la construction de l’arbre `a boˆıtes. C’est aussi lors de cette construction que l’on place le deuxi`eme fils en fonction de la hauteur du premier fils, l’espace ayant ´et´e r´eserv´e `a cet effet lors du calcul de la taille de la boˆıte courante. Dans certains cas, des probl`emes surviennent. En effet, dans le cas o` u le num´erateur 1

1 2

et 34 , on voit sur le rendu op´er´e par TEX ( 23 ) 4 que la barre de fraction entre le num´erateur et le d´enominateur est plus large. On voit ´egalement que le num´erateur et le d´enominateur sont centr´es par rapport `a cette barre. D`es lors, quelques r`egles ont ´et´e ajout´ees lors de la construction de la fraction. et le d´enominateur sont respectivement

R` egle suppl´ ementaire pour la construction de l’arbre interm´ ediaire Pour r´esoudre le probl`eme expliqu´e au point pr´ec´edent, l’id´ee est de pr´evoir une largeur de boˆıte un rien plus grande, tracer une barre de fraction prenant la totalit´e de la largeur de la boˆıte et enfin, centrer le num´erateur ainsi que le d´enominateur par rapport `a la barre trac´ee. D`es lors, le probl`eme pr´ecit´e est r´egl´e.

1 2 3 4 Fig. 5.10 – La balise mfrac dans le cas o` u le num´erateur et le d´enominateur ont la mˆeme largeur.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

5.15

50

munder, mover, munderover

La balise munder prend en arguments deux ´el´ements. Elle place le deuxi`eme ´el´ement (exemple : ∼) comme indice inf´erieur au premier (exemple : >). Exemple : > ∼ La balise mover prend en arguments deux ´el´ements. Elle place le deuxi`eme ´el´ement (exemple : α) comme indice sup´erieur au premier (exemple : −→). α Exemple : −→ La balise munderover prend en arguments trois ´el´ements. Elle place P le deuxi`eme ´el´ement (exemple : i = 0) comme indice inf´erieur au premier (exemple : ) et le troisi`eme ´el´ement (exemple : n) comme indice sup´erieur, ´egalement au premier. Exemple : n X i=0

Ces balises n’ont ´et´ees impl´ement´ees qu’en partie mais l’id´ee est de r´ealiser le mˆeme type de calcul que ceux effectu´es pour mfrac, sans tracer la barre de fraction. Une attention toute particuli`ere devra ˆetre consacr´ee aux ´el´ements mo qui doivent ˆetre ´etir´es.

5.16

mrow, merror, mphantom

Sp´ ecification du W3C concernant le rendu Un ´el´ement mrow s’utilise pour regrouper un nombre quelconque de sous-expressions, ´etant consitut´ees habituellement d’un ou plusieurs ´el´ements mo. Ceux-ci agissent comme op´erateurs sur une ou plusieurs expressions, qui sont leurs op´erandes. La balise mrow sert aussi `a regrouper des sous-expressions qui ont besoin d’ˆetre align´ees avec respect de leur ligne de base. C’est aussi `a l’int´erieur de cette balise que devrait ˆetre, dans le cas id´eal, impl´ement´e un algorithme de coupure de formules math´ematiques. En effet, l’utilisateur pourrait sp´ecifier une largeur maximale que devrait occuper la formule math´ematique. Dans le cas o` u une formule serait trop longue, il faudrait trouver le point de coupure (et donc placer le reste du contenu `a la ligne suivante) de cette formule. Actuellement, la transformation r´ealis´ee par la balise mrow est assez basique. L’op´eration faite est de parcourir r´ecursivement la liste des fils de mrow, de gauche vers la droite (autrement dit, de la mˆeme mani`ere que la formule est lue). Chaque ´el´ement envoie `a son fr`ere de droite (s’il y en a un), son contexte de formatage. Lors de sa construction, le noeud est donc plac´e `a droite de son fr`ere de gauche (ou selon le contexte courant s’il n’en poss`ede pas). Un probl`eme reste `a r´esoudre : il faudrait que cet ´el´ement g`ere l’alignement des diff´erents ´el´ements sur une mˆeme ligne de base. Par exemple, dans le cas o` u un ´el´ement


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

mrow

étape suivante

51

mrow

contexte

contexte mrow

mrow

contexte

mrow

Fig. 5.11 – Sch´ema aidant au calcul de la taille de la boˆıte de mrow et `a la compr´ehension de la mani`ere dont les fils sont construits.

mfrac est pr´esent dans les ´el´ements fils de mrow, les autres ´el´ements doivent s’aligner de fa¸con `a ce que l’op´erateur soit sur la mˆeme hauteur que la barre de fraction. L’autre ´el´ement (le caract`ere a) est lui aussi d´eplac´e `a hauteur de la barre de fraction.

lignes de base

A + B -

A + B 2

Fig. 5.12 – Ajustement des ´el´ements sur une mˆeme ligne de base.

Pour r´ealiser cela, la d´emarche est simple : lors du premier parcours, on place le 1er fils de l’´el´ement mrow sur une ligne de base d´efinie. Les appels des autres fils se fait avec cette valeur de ligne de base et viennent s’aligner sur celle-ci. Des attributs sont alors ajout´es `a l’int´erieur de la balise mrow de l’arbre interm´ediaire afin d’aligner tout le contenu de l’´el´ement mrow (lors du second parcours) sur celui de ses fr`eres, s’il en a.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

52

Actuellement, l’alignement sur une mˆeme ligne de base n’´etant pas g´er´e compl`etement, tous les ´el´ements atomiques disposent d’une hauteur fixe (non d´ependante de la m´etrique des caract`eres). L’axe des ordonn´ee ´etant invers´e, ces ´el´ements sont plac´es dans le document SVG `a la position y + height o` u height est la hauteur de la boˆıte. Cette valeur correspond donc `a leur ligne de base actuelle. D`es lors, ce n’est qu’une fois que le probl`eme d’ajustement sur une mˆeme ligne de base sera r´esolu que l’on pourrait impl´ementer, avec pr´ecision, la m´etrique des caract`eres de la police utilis´ee. Sans cela, plus rien ne serait align´e avec le positionnement tel qu’il est impl´ement´e actuellement. La balise merror subit le mˆeme traitement `a la diff´erence prˆet que lors du rendu, une balise rect est ajout´ee dans le document SVG, permettant de dessiner la boˆıte courante et donc d’encadrer le contenu englob´e par merror. La balise mphantom subit le mˆeme traitement `a la diff´erence prˆet que lors du rendu, le rendu des ´el´ements fils n’est pas op´er´e.

5.17

mpadded, mstyle, mfenced, mtable, mlabeledtr, mtr, mtd, maction, menclose, mmultiscripts

Aucune solution n’a ´et´e impl´ement´ee ou d´evelopp´ee concernant ces points. Malgr´e tout, nous allons essayer de d´ecrire certaines pistes permettant, via la solution expos´ee dans ces pages, de r´esoudre ces cas.

mpadded Sp´ecification du W3C concernant le rendu : Un ´el´ement mpadded rend la mˆeme chose que son contenu, mais avec sa taille globale et d’autres dimensions (telle que la position de la ligne de base) qui sont modifi´ees en fonction de ses attributs. L’´el´ement mpadded n’adapte pas (n’´etire ni ne retr´ecit) son contenu ; son seul effet est de modifier la taille et la position apparente de la « boˆıte englobante » autour de son contenu. Il agit donc sur le positionnement relatif du contenu par rapport aux ´el´ements environnants. Pour r´esoudre ce cas, on pourrait, lors de la construction de l’arbre interm´ediaire, modifier le calcul de la boˆıte englobant la formule et y ajouter des attributs concernant le positionnement des ´el´ements `a l’int´erieur de cette mˆeme boˆıte.

mstyle Sp´ecification du W3C concernant le rendu : L’´el´ement mstyle s’utilise pour effectuer des changements de style qui affectent le rendu de son contenu. On peut donner `a l’´el´ement mstyle n’importe lequel des attributs accept´es par les ´el´ements de pr´esentation MathML, pourvu que la valeur de l’attribut soit h´erit´ee, calcul´ee ou a une valeur par d´efaut ; les attributs des ´el´ements de pr´esentation dont les valeurs sont requises ne sont


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

53

pas accept´es par l’´el´ement mstyle. Une m´ethode consisterait en l’ajout d’un noeud de type <g> dans l’arbre r´esultat, ce noeud contenant les attributs sp´ecifi´es. La structure hi´erachique serait pr´eserv´ee dans le document SVG afin que les attributs soient h´erit´es par les mˆemes ´el´ements fils. Cette id´ee est expliqu´ee de mani`ere plus d´etaille `a la section 5.18.

mfenced Sp´ecification du W3C concernant le rendu : L’´el´ement mfenced fournit une forme commode dans laquelle exprimer des constructions communes faisant intervenir des d´elimiteurs (i.e., accolades, crochets et parenth`eses), incluant ´eventuellement des s´eparateurs (telles que des virgules) entre les arguments.

mtable, mlabeledtr, mtr, mtd Sp´ecification du W3C concernant le rendu : Les matrices, tableaux et autres notations math´ematiques en table sont balis´es en utilisant des ´el´ements mtable, mtr, mlabeledtr et mtd. Ces ´el´ements sont similaires aux ´el´ements TABLE, TR et TD de HTML, sauf qu’ils offrent des attributs sp´ecialis´es qui contrˆolent la disposition fine n´ecessaire pour les diagrammes commutatifs, les blocs de matrices et ainsi de suite. L’´el´ement mlabeledtr repr´esente une rang´ee ´etiquet´ee d’une table et peut s’utiliser pour des ´equations num´eriques. On peut repr´esenter une matrice identit´e 3 par 3 comme suit :

mtable

mtr

mtr

mtr

mtd

mtd

mtd

mtd

mtd

mtd

mtd

mtd

mtd

mn

mn

mn

mn

mn

mn

mn

mn

mn

1

0

0

0

1

0

0

0

1

Fig. 5.13 – Matrice identit´e 3*3 repr´esent´ee en MathML.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

54

Le rendu concernant ce code MathML devrait ˆetre : 1 0 0 0 1 0 0 0 1 Dans ce cas, la matrice est compos´e de 9 ´el´ements. Les boˆıtes des 9 feuilles correspondantes sont de taille ´egale. Dans ce cas simple, il est facile de calculer les boˆıtes correspondant `a chaque noeud dans l’arbre interm´ediaire : – La taille de l’´el´ement mtd est celle de l’´el´ement fils mn. – La taille de l’´el´ement mtr est telle que la hauteur soit celle des ´el´ements fils ; la largeur est trois fois celle des fils. – La taille de l’´el´ement mtable est telle que la largeur soit celle des ´el´ements fils ; la hauteur est trois fois celle des fils. Pla¸cons nous maintenant dans un cas moins ´evident o` u la matrice `a g´en´erer `a partir du MathML serait 1000 0 0 1 20 0 2 0 30 Dans ce cas, la largeur de l’´el´ement mtable devrait ˆetre calcul´ee de mani`ere plus g´en´erale. Isolons, pour mieux raisonner, la premi`ere colonne de la matrice pr´ecit´ee : 1000 1 2 La largeur de l’´el´ement mtable est proportionnelle `a la somme de la largeur de chaque ´el´ement le plus large de chaque colonne. Sa hauteur est plus simple `a calculer : elle correspond `a la somme des hauteurs de chaque ´el´ement mtd. A cela, l’on peut rajouter un peu d’espace horizontal entre chaque boˆıtes. Tous ces calculs pourraient s’effectuer lors de la construction et le parcours de l’´el´ement mtable. N’ayant pas r´ealis´e ce point, nous n’irons pas plus loin dans le d´eveloppement de ce probl`eme.

maction, menclose, mmultiscripts Aucune ´etude ni impl´ementation n’a ´et´e r´ealis´ee concernant ces points.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

55

largeur d'une colonne = largeur de l'élément le plus large 1000

0

0

1

20

0

2

0

30

largeur d'une ligne = somme de la largeur de chaque colonne

les éléments sont centrés par rapport à l'élément le plus large de la colonne

Fig. 5.14 – Probl`emes li´es au calcul de la boˆıte correspondant `a un ´el´ement mtable.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

5.18

56

La gestion des attributs des balises du MathML

La gestion des attributs du MathML vers le SVG dans le cadre de ce travail n’a, `a l’heure actuelle, pas ´et´e r´ealis´ee. Cependant, dans notre m´ethode de production, tout cela reste r´ealisable. En effet, une solution consisterait `a traduire un attribut de MathML en un attribut SVG. Lors du parcours de l’arbre interm´ediaire (lors de la production du SVG), il faut rajouter un noeud de type <g> dans l’arbre SVG ayant pour attributs ceux du MathML traduits en SVG5 .

mstyle mathcolor ='blue'

arbre intermédiaire vers le SVG

mrow mo

mi

mi

mathcolor ='green'

mathcolor ='red'

A

+

B

g style='fill:blue'

g

g

style='fill:green'

style='fill:red'

text

text

A+B

text moteur de rendu SVG

A

+

B SVG produit

Fig. 5.15 – Gestion des attributs MathML vers SVG via la balise de groupement g.

5 Pour rappel, la balise <g> de SVG a pour but de regrouper des ´el´ements, ces ´el´ements (enfants de ce noeud) h´eritent des propri´et´es d´efinies dans cette balise.


` CHAPITRE 5. REGLES DE TRANSFORMATIONS

5.19

57

Conclusion

Ne maˆıtrisant pas vraiment le langage XML en d´ebutant ce projet, il subsiste, `a l’heure actuelle, une certaine frustration de n’avoir pas su (pour cause de lenteur due au manque de maˆıtrise du langage) concr´etiser plus toutes les id´ees d´evelopp´ees. La lecture de ces pages pourrait, n´eanmoins, permettre de continuer facilement la r´eflexion `a propos du sujet et surtout, son impl´ementation.


Chapitre 6

Les r´ esultats Nous allons pr´esenter dans ce chapitre diff´erentes formules math´ematiques. Certaines ayant certains d´efauts, nous allons expliquer pour chacunes la provenance de ces imperfections.

6.1

Einstein

– Les alignements sont corrects. – Les proportions et le placement des diff´erents ´el´ements sont corrects. – L’espace autour du caract`ere « = » est discutable. L’impl´ementation du dictionnaire des op´erateurs serait n´ecessaire pour r´egler ce probl`emes. Les formules suivantes ont ce mˆeme probl`eme. Nous ne rappelerons donc pas celui-ci `a chaque description critique.

6.2

Une simple ´ equation

Les remarques que l’on pourrait faire concernant cet exemple sont similaires `a celles de la formule pr´ec´edente. 58


´ CHAPITRE 6. LES RESULTATS

6.3

59

Une racine

– Le dessin du radical n’est pas optimal. Pour ce faire, il faudrait utiliser le caract`ere sp´ecifi´e dans la d´efinition de la police utilis´ee.

6.4

Fractions imbriqu´ ees

Exemple de formule tel qu’expliqu´e `a la section 5.14.

6.5

Equation contenant des fractions

– L’impl´ementation du dictionnaire des op´erateurs est indispensable ainsi que le recalcul des boˆıtes correspondant aux parenth`eses. – L’espace compris entre le haut du a et la barre de fraction de la premi`ere fraction est trop important. La raison est que la m´etrique des caract`eres n’est actuellement impl´ement´ee que pour la largeur d’un caract`ere.


´ CHAPITRE 6. LES RESULTATS

6.6

60

Friedman-Robertson-Walker

Les remarques faites au point pr´ec´edent restent d’application pour cette formule.

6.7

Un exposant et des fractions

Une fois de plus, on voit les probl`emes survenir du fait que la hauteur d’un ´el´ement mi est actuellement fix´ee. L’ajout d’informations `a propos de la m´etrique des caract`eres est n´ecessaire. De plus, la sp´ecification de MathML dit qu’un caract`ere ne peut pas ˆetre rendu avec une taille inf´erieure `a 8pt. Cette caract´eristique est ´egalement `a ajouter `a l’impl´ementation.

6.8

Un petit m´ elange de divers ´ el´ ements MathML


´ CHAPITRE 6. LES RESULTATS

6.9

61

Des indices

<?xml version="1.0" encoding="iso-8859-1"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmln="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:t="http://localhost/tmp" version="1.1" width="570.86876" height="97.04724999999999"> <g style="stroke:none;fill:#000000;text-rendering:optimizeLegibility; font-family:CMR;"> <text style="font-family:CMMI;" x="483.58756999999997" y="77.5" font-size="100">x</text> <text x="541.530812" y="92.04724999999999" font-size="50.41">4</text> <text x="541.530812" y="41.54725" font-size="50.41">2</text> <text style="font-family:CMMI,CMSY,CMR;" x="406.33957" y="77.5" font-size="100">=</text> <text style="font-family:CMMI;" x="324.05838" y="77.5" font-size="100"> x</text> <text x="382.001622" y="92.04724999999999" font-size="50.41">3</text> <text style="font-family:CMMI,CMSY,CMR;" x="246.81038" y="77.5" font-size="100">+</text> <text style="font-family:CMMI;" x="164.52919000000003" y="77.5" font-size="100">x</text> <text x="222.47243200000003" y="92.04724999999999" font-size="50.41"> 2</text> <text style="font-family:CMMI,CMSY,CMR;" x="87.28119000000001" y="77.5" font-size="100">+</text> <text style="font-family:CMMI;" x="5" y="77.5" font-size="100">x</text> <text x="62.943242000000005" y="92.04724999999999" font-size="50.41"> 1</text> </g> <defs> <font id="CMR"> ... </font> </defs> </svg>


Chapitre 7

Conclusions Lorsque j’ai choisi ce sujet, je ne connaissais pas grand chose au monde XML : aucun cours n’est donn´e sur ce sujet actuellement `a l’institut Mont´efiore. A l’universit´e, nous avons appris `a apprendre. Une longue ´etude pr´eliminaire lors de l’´elaboration de cette solution a donc ´et´e necessaire. Nous avons montr´e que la transformation, en utilisant uniquement XSLT, est possible : chose qui n’´etait certainement pas ´evidente lorsque j’ai commenc´e `a ´etudier le probl`eme. On pourrait bien ´evidemment d´evelopper plus longuement la transformation et am´eliorer les r`egles en ´etudiant profond´ement, par exemple, les r`egles de rendu de formules du TeXBook de D. Knuth [6]. Au moment o` u se clˆoture ce travail, une s´erie de bonnes nouvelles, justifiant une fois de plus l’int´erˆet de ce travail, arrivent sur nos ´ecrans : – Un ´etudiant allemand, Bj¨orn Eickvonder, vient de rendre public son travail de fin d’´etudes consistant, lui aussi, `a transformer du MathML vers le SVG. Celui-ci utilise une solution bas´ee sur XSLT et JAVA1 . – Luca Padovani, dont la th`ese de doctorat MathML Formatting [11] m’a consid´erablement aid´ee dans l’´elaboration de la solution pr´ecit´ee, est actuellement occup´e `a ajouter la possibilit´e d’ajouter `a son application GtkMathView 2 la possibilit´e de cr´eer du SVG `a partir du formatage op´er´e par son programme. En effet, lorsqu’il a apprit le sujet de mes recherches et tent´e de r´epondre `a quelques unes de mes questions, l’id´ee lui est venue d’ajouter cette possibilit´e `a son application. Dans l’un de ses derniers mails, il ajoute : The more I think about it, the more I like the idea of rendering to SVG, and I think that there are a large number of possibilities of combining SVG and MathML for drawing complex formulas + diagrams.

1 2

http ://lufgi9.informatik.rwth-aachen.de/lehre/diplom/eickvonder/abschluss/ http ://helm.cs.unibo.it/software/mml-widget/

62


CHAPITRE 7. CONCLUSIONS

63

Clˆoturons par une note un peu plus personnelle. En plus de l’informatique, l’architecture et la photographie me passionnent. L’architecture consiste, quelque part, `a imaginer la position de certains ´el´ements en fonction de certaines contraintes (culturelles ou pratiques) bien pr´ecises. La photographie consiste, quelque part, `a capturer dans une structure bidimensionnelle, une image. Une belle photographie d´epend bien entendu du sujet, mais aussi de la mani`ere dont les diff´erents ´el´ements y sont plac´es, de fa¸con `a ce que celui qui la regarde trouve l’image visuellement belle. Je suis donc heureux que, quelque part, l’universit´e m’ait permis, mˆeme involontairement, de faire cohabiter quelques unes de mes passions `a l’int´erieur d’un seul et mˆeme travail.


Bibliographie [6]

Donald Knuth, ”The TeXbook”, Addison-Wesley : Reading, 1984.

[11] Luca Padovani, ”MathML Formatting”, Ph. D. Thesis, Technical Report UBLCS2003-03, Dept. Computer Science, Bologna, Italy, 2003. [21] J. Andr´e, I. Vatton, ”Contextual Typesetting of Mathematical Symbols Taking Care of Optical Scaling”, INRIA, 23 Juin 1993. [23] Michel Goossens and Vesa Sivunen, ”TEX SVG, Fonts”, TUGboat, Vol. 0, 2001.

64


Transformation de MathML en SVG par XSLT.