What other simple shapes svg can draw - graph

jaoudestudios · **Posted:** Wed Jul 09, 2008 8:46 pm

This graph is not dynamically generated, it is just a static image, however to make it dynamic should not be too difficult.

Code:

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
 <!-- Axis -->
 <line x1="5" y1="177" x2="5" y2="50" style="stroke:#f00;stroke-width:2"/>
 <line x1="3" y1="174" x2="150" y2="174" style="stroke:#f00;stroke-width:2"/>

 <!-- Axis details -->
 <line x1="3" y1="170" x2="5" y2="170" style="stroke:#f00;stroke-width:1"/>
 <line x1="3" y1="165" x2="5" y2="165" style="stroke:#f00;stroke-width:1"/> 
 <line x1="3" y1="160" x2="5" y2="160" style="stroke:#f00;stroke-width:1"/>
 <line x1="3" y1="155" x2="5" y2="155" style="stroke:#f00;stroke-width:1"/>

 <!-- Data -->
 <rect x="10" y="70" width="30" height="100" style="fill:#ccc;stroke-width:0; stroke:#000"/>
 <rect x="45" y="100" width="30" height="70" style="fill:#333;stroke-width:0; stroke:#000"/>
 <rect x="80" y="80" width="30" height="90" style="fill:#999;stroke-width:0; stroke:#000"/>
 <rect x="115" y="120" width="30" height="50" style="fill:#666;stroke-width:0; stroke:#000"/>

 <!-- Text -->
 <text x="5" y="40" style="font-family:arial;font-size:24">Test graph</text>
</svg>

tinram · **Posted:** Mon Jul 28, 2008 8:06 pm

Works well in IE?

jaoudestudios · **Posted:** Tue Jul 29, 2008 6:44 am

Nope IE is shit. There is a plugin download to make it work but it is a bit flaky.

What I do is convert it to a gif/jpeg when I need to display it to the browser. But I still store the svg so that I can do anything to it, i.e. zoom, change colours etc.

jaoudestudios · **Posted:** Tue Jul 29, 2008 6:59 am

This might help...i just posted a class I wrote a few weeks back, that created curved corners from an SVG then converted it to a GIF (can also do a few other things like ZIP it up for download or display GIFs to screen)

http://www.forum.jaoudestudios.com/viewtopic.php?f=13&t=84

JaoudeStudios.com

What other simple shapes svg can draw - graph

Who is online