We chose SVG to represent the graphic. SVG is an XML application to describe 2 dimensional vectorial gpaphics. SVG can be interpreted, for instance, by plugins that show the graphic instead of the XML code.
To summarize, what we need to do is to transform an XML document to another XML document (SVG). XSLT is a key technology to achieve this. Applying a XSLT stylesheet upon the XML source document produces the SVG document :
Unfortunetely, this is not enough. Let's explain why through the following example that shows, on the left hand side a TAGML document (the XML document for which we want a graphic), and on the right hand side the corresponding graphic.
<node> is represented on the graphic with a blue rectangle
with rounded corners. Each
cat attribute becomes the text
centered on the blue rectangle. Other elements are present on the graphic, but
node is enough to show the insufficiency of the only XSLT transformation. We
clearly see on the graphic that the 2 rectangles have 2 different locations. These locations
take into account the presence of the other graphical elements so that no one overlap any
other one. Graphical elements' coordinates have been computed taking into account these
constraints, what is impossible to do with a XSLT transformation.
The principle of a XSLT tranformation is always to do the same thing when dealing with
a certain tag, in this case
<node>. But for each
the location to compute is different, and so are the constraints (graphical elements around
<node> are not the same).
Direct transformation is not possible.
The first approach is not completly wrong, it is just insufficient. The only problem we cannot solve with the XSLT transformation is the computation of the coordinates of the graphical elements. The idea is to put the problem off the XSLT transformation. A high level program will be in charge of the computation of the coordinates.
The process of transformation now looks like this :
The XML intermediary document describes, in an abstract manner, the relative position of the graphical elements one against each other.
The Definitions Document contains some SVG snippets used for backgrounds. We will have a closer look at it later.