René Nyffenegger's collection of things on the web
René Nyffenegger on Oracle - Most wanted - Feedback -
 

SVG examples: table

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [ ]>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" width='800px' height='900px' >

<defs>
  <rect id='r' width='30' height='30' x= '0' />
  <rect id='r' width='30' height='30' x='30' />
  <rect id='r' width='30' height='30' x='60' />


  <style type="text/css">
      <![CDATA[
                    .cell   {stroke:black;fill:#ccffcc;stroke-width:2px;opacity:1;}
      ]]>
   </style>

   <g id='row'>
     <use xlink:href='#r' x=  '0' class='cell'  />
     <use xlink:href='#r' x= '30' class='cell'  />
     <use xlink:href='#r' x= '60' class='cell'  />
     <use xlink:href='#r' x= '90' class='cell'  />
     <use xlink:href='#r' x='120' class='cell'  />
     <use xlink:href='#r' x='150' class='cell'  />
     <use xlink:href='#r' x='180' class='cell'  />
     <use xlink:href='#r' x='210' class='cell'  />
   </g>

</defs>

  

<g transform='translate(170,140)'>
  <g transform='translate(0,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Manufacturing</text>
  </g>
  <g transform='translate(30,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Market Research</text>
  </g>
  <g transform='translate(60,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Finance</text>
  </g>
  <g transform='translate(90,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Telecoms</text>
  </g>
  <g transform='translate(120,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Transport</text>
  </g>
  <g transform='translate(150,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Public Sector</text>
  </g>
  <g transform='translate(180,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Science &amp; Technology</text>
  </g>
  <g transform='translate(210,0)'>
    <text width='150' heigth='30' transform='rotate(270)' >Market Research</text>
  </g>
</g>

<g transform='translate(150,150)' >
  <g transform='translate(0,  0)' >
    <use xlink:href='#row'       />
  </g>

  <g transform='translate(0, 30)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0, 60)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0, 90)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0,120)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0,150)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0,180)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0,210)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(0,240)'>
    <use xlink:href='#row'      />
  </g>

  <g transform='translate(-130,15)'>
    <text y=  '0'>Body Leasing           </text>
    <text y= '30'>Prof. Services         </text>
    <text y= '60'>Integration            </text>
    <text y= '90'>Datawarehousing        </text>
    <text y='120'>ERP                    </text>
    <text y='150'>DB Design              </text>
    <text y='180'>Oracle Development     </text>
    <text y='210'>SQL Server Dev.        </text>
    <text y='240'>???                    </text>
  </g>
</g>
</svg>
See also other SVG examples.