XForms/SVG

      Motivation

      You want to dynamically load and render SVG.

      ↑Jump back a section

      Sample Program

      <html xmlns="http://www.w3.org/1999/xhtml" 
         xmlns:ev="http://www.w3.org/2001/xml-events" 
         xmlns:xsd="http://www.w3.org/2001/XMLSchema" 
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
         xmlns:xf="http://www.w3.org/2002/xforms" 
         xmlns:svg="http://www.w3.org/2000/svg">
         <head>
            <title>SVG Browser</title>
               <style type="text/css">
                 #svgimg .xforms-value {width: 400px; min-width: 400px; height: 400px; min-height: 400px;}
              </style>
              <xf:model>
                 <xf:instance id="current">
                                      <current xmlns=""/>
                 </xf:instance>
                 <xf:instance id="names">
                    <names xmlns="">
                      <name fname="mozilla.svg">Mozilla</name>
                      <name fname="wii.svg">Wii</name>
                      <name fname="duke.svg">Duke</name>
                      <name fname="git.svg">Git</name>
                      <name fname="cartman.svg">Cartman</name>
                      <name fname="tiger.svg">Tiger</name>
                      <name fname="gcheck.svg">GCheck</name>
                      <name fname="pencil.svg">Pencil</name>
                      <name fname="python.svg">Python</name>
                      <name fname="ietf.svg">IETF</name>
                      <name fname="osgr_pie.svg">OSGR Pie</name>
                    </names>
                 </xf:instance>
                 <xf:instance id="inlinesvg">       
                      <svg xmlns='http://www.w3.org/2000/svg'/>
                 </xf:instance>
                 <xf:submission id="loadsvg" method="get" 
                        replace="instance" instance="inlinesvg" 
                        serialization="none" mode="synchronous">
                      <xf:resource value="concat('svg/',.)"/>
                 </xf:submission>
       
                 <xf:action ev:event="xforms-ready">
                      <xf:setvalue ref="." value="instance('names')/name[1]/@fname"/>
                      <xf:send submission="loadsvg"/>
                 </xf:action>
             </xf:model>
         </head>
         <body>
           <h1>SVG Browser</h1>
                      <xf:select1 ref="." appearance="minimal" incremental="true">
                              <xf:label>Select SVG: </xf:label>
                              <xf:itemset nodeset="instance('names')/name">
                                      <xf:label ref="."/>
                                      <xf:value ref="@fname"/>
                              </xf:itemset>
                              <xf:send ev:event="xforms-value-changed" submission="loadsvg"/>
                      </xf:select1>
       
                      <xf:trigger>
                              <xf:label>Next</xf:label>
                              <xf:setvalue ev:event="DOMActivate" ref="." value="if(instance('names')/name[preceding-sibling::name[1]/@fname = current()],instance('names')/name[preceding-sibling::name[1]/@fname = current()]/@fname,instance('names')/name[1]/@fname)"/>
                      </xf:trigger>
       
                      <br/>
            <xf:output id="svgimg" value="xf:serialize(instance('inlinesvg'))" mediatype="image/svg+xml"/>
         </body>
      </html>
      
      ↑Jump back a section

      Credits

      This was created by Alain Couthures on the XSLTForms mailing list.

      ↑Jump back a section
      Last modified on 4 March 2011, at 12:34