6. Génération de SVG avec XSLT (et via PHP)

<?php

header("Content-type: image/svg+xml")
;

Code PHP

• il vous suffit de copier le fichier php et de changer les noms des 2 fichiers)
• Depuis le Web, prendre travaux.text et ensuite renommer en travaux.php

header("Content-type: image/svg+xml");

error_reporting(E_ALL);

$xml_file = 'travaux.xml';

$xsl_file = 'travaux.xsl';

// load the xml file (and test first if it exists)

$dom_object = new DomDocument();

if (!file_exists($xml_file)) exit('Failed to open $xml_file');

$dom_object->load($xml_file);

// create dom object for the XSL stylesheet and configure the transformer

$xsl_obj = new DomDocument();

if (!file_exists($xsl_file)) exit('Failed to open $xsl_file');

$xsl_obj->load($xsl_file);

$proc = new XSLTProcessor;

$proc->importStyleSheet($xsl_obj); // attach the xsl rules

$html_fragment = $proc->transformToXML($dom_object);

print ($html_fragment); 

Code XSLT: travaux.xsl

• Ici on utilisera un style de programmation fonctionnelle (donc pas le mécanisme habituel d'exécution de règles)
• Depuis le Web: faire "view source" avant de le sauver !!
• les explications viendront un autre jour ....

<?xml version="1.0" encoding="ISO-8859-1"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

 <xsl:output method="xml" indent="yes" 

  encoding="ISO-8859-1"

  standalone="no"

  doctype-public="-//W3C//DTD SVG 1.0//EN" 

  doctype-system="http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" />

 <!-- GLOBAL PARAMETERS - you may change this -->

 <xsl:param name="increase-y" select="60"/>

 <xsl:param name="element-length" select="150"/>

 <xsl:param name="element-height" select="30"/>

 <xsl:param name="space" select="10"/>

 <!-- XSLT Functions -->

 <!-- Display a single exercise -->

 <xsl:template name="render-exercise">

  <xsl:param name="position-x"/>

  <xsl:param name="position-y"/>

  <rect x="{$position-x * ( $element-length + $space ) }" 

        y="{$position-y * $increase-y }" 

        width="{$element-length}" 

        height="{$element-height}"

        style="fill:yellow; stroke:black; stroke-width:3"/>

  <text x="{$position-x * ( $element-length + $space ) }" 

        y="{$position-y * $increase-y + 15 }"  style="stroke:#000099;fill:#000099;font-size:10;">

   <xsl:value-of select="title"/>

  </text>

 </xsl:template>

 <!-- Display a course (Text + each exercise a box on the same line  -->

 <xsl:template name="render-course">

  <xsl:param name="position-y"/>

  <text x="{$space}" y="{$position-y * $increase-y - $space }"  

        style="stroke:#000099;fill:#000099;font-size:12;">

   <xsl:value-of select="title"/>

  </text>

  <xsl:for-each select="exercise">

   <xsl:call-template name="render-exercise">

    <xsl:with-param name="position-x" select="position()"/>

    <xsl:with-param name="position-y" select="$position-y"/>

   </xsl:call-template>

  </xsl:for-each>

 </xsl:template>

 <xsl:template match="student">

  <svg width="1000" height="900">

   <!-- xmlns="http://www.w3.org/2000/svg"> -->

   <text x="{$space}" y="90" style="stroke:#000099;fill:#000099;font-size:24;">

    Example visualisation of a student's work page</text>

   <svg y="3cm">

    <xsl:for-each select="//course">

    <xsl:call-template name="render-course">

     <xsl:with-param name="position-y" select="position()"/>

    </xsl:call-template>

   </xsl:for-each>

   </svg>

  </svg>

 </xsl:template>

</xsl:stylesheet>