Nachdem eine SVG Standards SVG Grafik Anwendungsgebiete Visualisierung im XML Format vorliegt, kann diese auch direkt mittels XSLT erzeugt werden. Über das HTML5 <svg> Element kann so eine Grafik inline in das - ebenfalls durch das XSLT - generierte HTML Dokument eingebunden werden.
Betrachten wir unser Beispiel von oben, erweitert um drei neue <block> Elemente:
<?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="chart.xsl" ?> <document> <title>Das ultimative Zwei-Kapitel Dokument</title> <chapter> <title>Kapitel 1</title> <intro>In Kapitel 1 wird kurz gesagt was Sache ist.</intro> <content>Um es kurz zu machen, wie der Hase läuft steht in Kapitel 2.</content> </chapter> <chapter> <title>Kapitel 2</title> <intro>Hier wird erklärt, wie der Hase läuft.</intro> <content>Im Prinzip ist es ganz einfach. Betrachten wir doch drei gelbe Blöcke: </content> <block/> <block/> <block/> </chapter> </document>Plain Text
Wenn wir das XSLT Stylesheet noch um eine Regel für das neue <block> Element ergänzen, so wie hier:
<xsl:template match="block"> <svg style="background-color:yellow" width="30" height="30" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"/> <br/> <br/> </xsl:template>Plain Text
Dann erhalten wir drei schön formatierte gelbe SVG Blöcke ...
Weiterführende Links: