RubyGems - svg_graph - Versions diffs - 0.7 - Mend

svg_graph 0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (42) hide show

data/.gitignore +4 -0
data/GPL.txt +340 -0
data/Gemfile +4 -0
data/LICENSE.txt +57 -0
data/Rakefile +1 -0
data/images/bar.png +0 -0
data/images/bar.svg +76 -0
data/images/bar.svgz +0 -0
data/images/barhorizontal.png +0 -0
data/images/barhorizontal.svg +76 -0
data/images/barhorizontal.svgz +0 -0
data/images/line.png +0 -0
data/images/line.svg +80 -0
data/images/line.svgz +0 -0
data/images/pie.png +0 -0
data/images/pie.svg +70 -0
data/images/pie.svgz +0 -0
data/images/plot.png +0 -0
data/images/plot.svg +131 -0
data/images/plot.svgz +0 -0
data/images/schedule.png +0 -0
data/images/schedule.svg +67 -0
data/images/timeseries.png +0 -0
data/images/timeseries.svg +179 -0
data/images/timeseries.svgz +0 -0
data/index.html +445 -0
data/install.rb +161 -0
data/lib/svg_graph.rb +11 -0
data/lib/svg_graph/Bar.rb +148 -0
data/lib/svg_graph/BarBase.rb +139 -0
data/lib/svg_graph/BarHorizontal.rb +149 -0
data/lib/svg_graph/Graph.rb +980 -0
data/lib/svg_graph/Graph.rb~ +980 -0
data/lib/svg_graph/Line.rb +444 -0
data/lib/svg_graph/Pie.rb +395 -0
data/lib/svg_graph/Plot.rb +500 -0
data/lib/svg_graph/Schedule.rb +373 -0
data/lib/svg_graph/TimeSeries.rb +241 -0
data/lib/svg_graph/version.rb +6 -0
data/screenshots.html +250 -0
data/svg_graph.gemspec +20 -0
metadata +106 -0

data/images/timeseries.png ADDED

Binary file

data/images/timeseries.svg ADDED

@@ -0,0 +1,179 @@
+<?xml version='1.0'?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 640 480' height='480' width='640' xmlns='http://www.w3.org/2000/svg' xmlns:a3="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" a3:scriptImplementation="Adobe">
+    <!-- \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
+  -->
+    <!-- Created with SVG::Graph
+  -->
+    <!-- Sean Russell
+  -->
+    <!-- Based on SVG::TT::Graph for Perl by Leo Lapworth & Stephan Morgan
+  -->
+    <!-- //////////////////////////////////////////////////////////////////
+  -->
+  <defs/>
+    <!--SVG Background
+  -->
+  <rect x='0' class='svgBackground' y='0' height='480' style='fill:#ffffff;' width='640'/>
+  <g transform='translate( 40.4 26 )'>
+    <rect x='0' class='graphBackground' y='0' height='394' style='fill:#f0f0f0;' width='480.6'/>
+    <path class='axis' d='M 0 0 v394' id='xAxis' style='stroke: #000000; stroke-width: 1px;'/>
+    <path class='axis' d='M 0 394 h480.6' id='yAxis' style='stroke: #000000; stroke-width: 1px;'/>
+    <text x='0.0' class='xAxisLabels' y='409' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1973</text>
+    <text x='72.9780617037263' class='xAxisLabels' y='426' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1978</text>
+    <path class='staggerGuideLine' d='M72.9780617037263 394 v17' style='fill: none; stroke: #000000; stroke-width: 0.5px;'/>
+    <path class='guideLines' d='M72.9780617037263 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='145.956123407453' class='xAxisLabels' y='409' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1983</text>
+    <path class='guideLines' d='M145.956123407453 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='218.934185111179' class='xAxisLabels' y='426' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1988</text>
+    <path class='staggerGuideLine' d='M218.934185111179 394 v17' style='fill: none; stroke: #000000; stroke-width: 0.5px;'/>
+    <path class='guideLines' d='M218.934185111179 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='291.912246814905' class='xAxisLabels' y='409' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1993</text>
+    <path class='guideLines' d='M291.912246814905 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='364.890308518632' class='xAxisLabels' y='426' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>1998</text>
+    <path class='staggerGuideLine' d='M364.890308518632 394 v17' style='fill: none; stroke: #000000; stroke-width: 0.5px;'/>
+    <path class='guideLines' d='M364.890308518632 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='437.868370222358' class='xAxisLabels' y='409' style='text-anchor: middle; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: middle'>2003</text>
+    <path class='guideLines' d='M437.868370222358 0 v394' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='398.0' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>0</text>
+    <text x='-3' class='yAxisLabels' y='356.888888888889' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>2</text>
+    <path class='guideLines' d='M0 352.888888888889 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='315.777777777778' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>4</text>
+    <path class='guideLines' d='M0 311.777777777778 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='274.666666666667' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>6</text>
+    <path class='guideLines' d='M0 270.666666666667 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='233.555555555556' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>8</text>
+    <path class='guideLines' d='M0 229.555555555556 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='192.444444444444' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>10</text>
+    <path class='guideLines' d='M0 188.444444444444 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='151.333333333333' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>12</text>
+    <path class='guideLines' d='M0 147.333333333333 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='110.222222222222' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>14</text>
+    <path class='guideLines' d='M0 106.222222222222 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='69.1111111111111' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>16</text>
+    <path class='guideLines' d='M0 65.1111111111111 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <text x='-3' class='yAxisLabels' y='28.0' style='text-anchor: end; fill: #000000; font-size: 12px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;text-anchor: end'>18</text>
+    <path class='guideLines' d='M0 24.0 h480.6' style='stroke: #666666; stroke-width: 1px; stroke-dasharray: 5 5;'/>
+    <path class='line1' d='M14.9843030972302 250.111111111111 L14.9843030972302 250.111111111111 21.25842845231 167.888888888889 184.865238666939 352.888888888889 228.664228406859 373.444444444444 321.658821548009 126.777777777778 418.806192989469 209.0 456.6 167.888888888889 ' style='fill: none; stroke: #ff0000; stroke-width: 1px;'/>
+    <circle cy='250.111111111111' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='14.9843030972302'/>
+    <circle cy='167.888888888889' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='21.25842845231'/>
+    <circle cy='352.888888888889' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='184.865238666939'/>
+    <circle cy='373.444444444444' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='228.664228406859'/>
+    <circle cy='126.777777777778' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='321.658821548009'/>
+    <circle cy='209.0' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='418.806192989469'/>
+    <circle cy='167.888888888889' class='dataPoint1' r='2.5' style='fill: #ff0000; stroke: none; stroke-width: 1px;' cx='456.6'/>
+    <path class='line2' d='M8.47040225087341 24.0 L8.47040225087341 24.0 55.5063611230323 85.6666666666666 102.543985102769 311.777777777778 149.619906556808 106.222222222222 196.654200321388 270.666666666667 243.730121775427 147.333333333333 290.767745755164 270.666666666667 337.843667209202 44.5555555555555 384.877960973783 147.333333333333 431.913919845942 250.111111111111 ' style='fill: none; stroke: #0000ff; stroke-width: 1px;'/>
+    <circle cy='24.0' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='8.47040225087341'/>
+    <circle cy='85.6666666666666' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='55.5063611230323'/>
+    <circle cy='311.777777777778' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='102.543985102769'/>
+    <circle cy='106.222222222222' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='149.619906556808'/>
+    <circle cy='270.666666666667' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='196.654200321388'/>
+    <circle cy='147.333333333333' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='243.730121775427'/>
+    <circle cy='270.666666666667' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='290.767745755164'/>
+    <circle cy='44.5555555555555' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='337.843667209202'/>
+    <circle cy='147.333333333333' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='384.877960973783'/>
+    <circle cy='250.111111111111' class='dataPoint2' r='2.5' style='fill: #0000ff; stroke: none; stroke-width: 1px;' cx='431.913919845942'/>
+    <path class='line3' d='M72.9716745119474 291.222222222222 L72.9716745119474 291.222222222222 145.943349023895 126.777777777778 291.926660629669 188.444444444444 437.870009653564 291.222222222222 ' style='fill: none; stroke: #00ff00; stroke-width: 1px;'/>
+    <circle cy='291.222222222222' class='dataPoint3' r='2.5' style='fill: #00ff00; stroke: none; stroke-width: 1px;' cx='72.9716745119474'/>
+    <circle cy='126.777777777778' class='dataPoint3' r='2.5' style='fill: #00ff00; stroke: none; stroke-width: 1px;' cx='145.943349023895'/>
+    <circle cy='188.444444444444' class='dataPoint3' r='2.5' style='fill: #00ff00; stroke: none; stroke-width: 1px;' cx='291.926660629669'/>
+    <circle cy='291.222222222222' class='dataPoint3' r='2.5' style='fill: #00ff00; stroke: none; stroke-width: 1px;' cx='437.870009653564'/>
+    <g>
+      <text visibility='hidden' x='19.9843030972302' y='238.111111111111' id='538641648' style='fill: #000; text-anchor: start;'>01/11/74</text>
+      <circle cy='250.111111111111' onmouseover='document.getElementById(538641648).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538641648).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='14.9843030972302' style='opacity: 0'/>
+      <text x='14.9843030972302' class='dataPointLabel' y='244.111111111111' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>7</text>
+      <text x='14.9843030972302' class='dataPointLabel' y='244.111111111111' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>7</text>
+      <text visibility='hidden' x='26.25842845231' y='155.888888888889' id='538638598' style='fill: #000; text-anchor: start;'>06/17/74</text>
+      <circle cy='167.888888888889' onmouseover='document.getElementById(538638598).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538638598).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='21.25842845231' style='opacity: 0'/>
+      <text x='21.25842845231' class='dataPointLabel' y='161.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>11</text>
+      <text x='21.25842845231' class='dataPointLabel' y='161.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>11</text>
+      <text visibility='hidden' x='189.865238666939' y='340.888888888889' id='538635548' style='fill: #000; text-anchor: start;'>09/01/85</text>
+      <circle cy='352.888888888889' onmouseover='document.getElementById(538635548).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538635548).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='184.865238666939' style='opacity: 0'/>
+      <text x='184.865238666939' class='dataPointLabel' y='346.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>2</text>
+      <text x='184.865238666939' class='dataPointLabel' y='346.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>2</text>
+      <text visibility='hidden' x='233.664228406859' y='361.444444444444' id='538632498' style='fill: #000; text-anchor: start;'>09/01/88</text>
+      <circle cy='373.444444444444' onmouseover='document.getElementById(538632498).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538632498).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='228.664228406859' style='opacity: 0'/>
+      <text x='228.664228406859' class='dataPointLabel' y='367.444444444444' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>1</text>
+      <text x='228.664228406859' class='dataPointLabel' y='367.444444444444' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>1</text>
+      <text visibility='hidden' x='326.658821548009' y='114.777777777778' id='538629448' style='fill: #000; text-anchor: start;'>01/15/95</text>
+      <circle cy='126.777777777778' onmouseover='document.getElementById(538629448).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538629448).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='321.658821548009' style='opacity: 0'/>
+      <text x='321.658821548009' class='dataPointLabel' y='120.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>13</text>
+      <text x='321.658821548009' class='dataPointLabel' y='120.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>13</text>
+      <text visibility='hidden' x='423.806192989469' y='197.0' id='538626398' style='fill: #000; text-anchor: start;'>09/11/01</text>
+      <circle cy='209.0' onmouseover='document.getElementById(538626398).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538626398).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='418.806192989469' style='opacity: 0'/>
+      <text x='418.806192989469' class='dataPointLabel' y='203.0' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>9</text>
+      <text x='418.806192989469' class='dataPointLabel' y='203.0' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>9</text>
+      <text visibility='hidden' x='461.6' y='155.888888888889' id='538623328' style='fill: #000; text-anchor: start;'>04/13/04</text>
+      <circle cy='167.888888888889' onmouseover='document.getElementById(538623328).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538623328).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='456.6' style='opacity: 0'/>
+      <text x='456.6' class='dataPointLabel' y='161.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>11</text>
+      <text x='456.6' class='dataPointLabel' y='161.888888888889' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>11</text>
+      <text visibility='hidden' x='13.4704022508734' y='12.0' id='538619318' style='fill: #000; text-anchor: start;'>08/01/73</text>
+      <circle cy='24.0' onmouseover='document.getElementById(538619318).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538619318).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='8.47040225087341' style='opacity: 0'/>
+      <text x='8.47040225087341' class='dataPointLabel' y='18.0' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>18</text>
+      <text x='8.47040225087341' class='dataPointLabel' y='18.0' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>18</text>
+      <text visibility='hidden' x='60.5063611230323' y='73.6666666666666' id='538616268' style='fill: #000; text-anchor: start;'>10/21/76</text>
+      <circle cy='85.6666666666666' onmouseover='document.getElementById(538616268).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538616268).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='55.5063611230323' style='opacity: 0'/>
+      <text x='55.5063611230323' class='dataPointLabel' y='79.6666666666666' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>15</text>
+      <text x='55.5063611230323' class='dataPointLabel' y='79.6666666666666' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>15</text>
+      <text visibility='hidden' x='107.543985102769' y='299.777777777778' id='538613218' style='fill: #000; text-anchor: start;'>01/11/80</text>
+      <circle cy='311.777777777778' onmouseover='document.getElementById(538613218).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538613218).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='102.543985102769' style='opacity: 0'/>
+      <text x='102.543985102769' class='dataPointLabel' y='305.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>4</text>
+      <text x='102.543985102769' class='dataPointLabel' y='305.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>4</text>
+      <text visibility='hidden' x='154.619906556808' y='94.2222222222222' id='538610168' style='fill: #000; text-anchor: start;'>04/03/83</text>
+      <circle cy='106.222222222222' onmouseover='document.getElementById(538610168).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538610168).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='149.619906556808' style='opacity: 0'/>
+      <text x='149.619906556808' class='dataPointLabel' y='100.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>14</text>
+      <text x='149.619906556808' class='dataPointLabel' y='100.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>14</text>
+      <text visibility='hidden' x='201.654200321388' y='258.666666666667' id='538607118' style='fill: #000; text-anchor: start;'>06/23/86</text>
+      <circle cy='270.666666666667' onmouseover='document.getElementById(538607118).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538607118).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='196.654200321388' style='opacity: 0'/>
+      <text x='196.654200321388' class='dataPointLabel' y='264.666666666667' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>6</text>
+      <text x='196.654200321388' class='dataPointLabel' y='264.666666666667' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>6</text>
+      <text visibility='hidden' x='248.730121775427' y='135.333333333333' id='538604068' style='fill: #000; text-anchor: start;'>09/13/89</text>
+      <circle cy='147.333333333333' onmouseover='document.getElementById(538604068).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538604068).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='243.730121775427' style='opacity: 0'/>
+      <text x='243.730121775427' class='dataPointLabel' y='141.333333333333' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>12</text>
+      <text x='243.730121775427' class='dataPointLabel' y='141.333333333333' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>12</text>
+      <text visibility='hidden' x='295.767745755164' y='258.666666666667' id='538601018' style='fill: #000; text-anchor: start;'>12/03/92</text>
+      <circle cy='270.666666666667' onmouseover='document.getElementById(538601018).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538601018).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='290.767745755164' style='opacity: 0'/>
+      <text x='290.767745755164' class='dataPointLabel' y='264.666666666667' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>6</text>
+      <text x='290.767745755164' class='dataPointLabel' y='264.666666666667' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>6</text>
+      <text visibility='hidden' x='342.843667209202' y='32.5555555555555' id='538597968' style='fill: #000; text-anchor: start;'>02/24/96</text>
+      <circle cy='44.5555555555555' onmouseover='document.getElementById(538597968).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538597968).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='337.843667209202' style='opacity: 0'/>
+      <text x='337.843667209202' class='dataPointLabel' y='38.5555555555555' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>17</text>
+      <text x='337.843667209202' class='dataPointLabel' y='38.5555555555555' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>17</text>
+      <text visibility='hidden' x='389.877960973783' y='135.333333333333' id='538594918' style='fill: #000; text-anchor: start;'>05/16/99</text>
+      <circle cy='147.333333333333' onmouseover='document.getElementById(538594918).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538594918).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='384.877960973783' style='opacity: 0'/>
+      <text x='384.877960973783' class='dataPointLabel' y='141.333333333333' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>12</text>
+      <text x='384.877960973783' class='dataPointLabel' y='141.333333333333' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>12</text>
+      <text visibility='hidden' x='436.913919845942' y='238.111111111111' id='538591868' style='fill: #000; text-anchor: start;'>08/05/02</text>
+      <circle cy='250.111111111111' onmouseover='document.getElementById(538591868).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538591868).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='431.913919845942' style='opacity: 0'/>
+      <text x='431.913919845942' class='dataPointLabel' y='244.111111111111' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>7</text>
+      <text x='431.913919845942' class='dataPointLabel' y='244.111111111111' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>7</text>
+      <text visibility='hidden' x='77.9716745119474' y='279.222222222222' id='538588218' style='fill: #000; text-anchor: start;'>01/01/78</text>
+      <circle cy='291.222222222222' onmouseover='document.getElementById(538588218).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538588218).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='72.9716745119474' style='opacity: 0'/>
+      <text x='72.9716745119474' class='dataPointLabel' y='285.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>5</text>
+      <text x='72.9716745119474' class='dataPointLabel' y='285.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>5</text>
+      <text visibility='hidden' x='150.943349023895' y='114.777777777778' id='538585168' style='fill: #000; text-anchor: start;'>01/01/83</text>
+      <circle cy='126.777777777778' onmouseover='document.getElementById(538585168).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538585168).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='145.943349023895' style='opacity: 0'/>
+      <text x='145.943349023895' class='dataPointLabel' y='120.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>13</text>
+      <text x='145.943349023895' class='dataPointLabel' y='120.777777777778' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>13</text>
+      <text visibility='hidden' x='296.926660629669' y='176.444444444444' id='538582118' style='fill: #000; text-anchor: start;'>01/01/93</text>
+      <circle cy='188.444444444444' onmouseover='document.getElementById(538582118).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538582118).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='291.926660629669' style='opacity: 0'/>
+      <text x='291.926660629669' class='dataPointLabel' y='182.444444444444' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>10</text>
+      <text x='291.926660629669' class='dataPointLabel' y='182.444444444444' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>10</text>
+      <text visibility='hidden' x='442.870009653564' y='279.222222222222' id='538579068' style='fill: #000; text-anchor: start;'>01/01/03</text>
+      <circle cy='291.222222222222' onmouseover='document.getElementById(538579068).setAttribute(&apos;visibility&apos;, &apos;visible&apos; )' r='10' onmouseout='document.getElementById(538579068).setAttribute(&apos;visibility&apos;, &apos;hidden&apos; )' cx='437.870009653564' style='opacity: 0'/>
+      <text x='437.870009653564' class='dataPointLabel' y='285.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal; stroke: #fff; stroke-width: 2;'>5</text>
+      <text x='437.870009653564' class='dataPointLabel' y='285.222222222222' style='fill: #000000; text-anchor:middle; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>5</text>
+    </g>
+  </g>
+  <text x='320' class='mainTitle' y='16' style='text-anchor: middle; fill: #000000; font-size: 16px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Plot</text>
+  <text x='320' class='xAxisTitle' y='468' style='text-anchor: middle; fill: #ff0000; font-size: 14px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Time</text>
+  <text transform='rotate( -90, 17, 240 )' x='17' class='yAxisTitle' y='240' style='fill: #ff0000; text-anchor: middle; font-size: 14px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Units</text>
+  <g transform='translate(531.0 46)'>
+    <rect x='0' class='key1' y='0' height='12' style='fill: #ff0000; stroke: none; stroke-width: 1px;' width='12'/>
+    <text x='17' class='keyText' y='12' style='fill: #000000; text-anchor:start; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Ice Cream</text>
+    <rect x='0' class='key2' y='17' height='12' style='fill: #0000ff; stroke: none; stroke-width: 1px;' width='12'/>
+    <text x='17' class='keyText' y='29' style='fill: #000000; text-anchor:start; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Ice Cream Cones</text>
+    <rect x='0' class='key3' y='34' height='12' style='fill: #00ff00; stroke: none; stroke-width: 1px;' width='12'/>
+    <text x='17' class='keyText' y='46' style='fill: #000000; text-anchor:start; font-size: 10px; font-family: &quot;Arial&quot;, sans-serif; font-weight: normal;'>Sprinkles</text>
+  </g>
+</svg>

data/images/timeseries.svgz ADDED

Binary file

data/index.html ADDED

@@ -0,0 +1,445 @@
+<html>
+<head>
+<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>SVG::Graph</title>
+<style media="all" type="text/css">@import "/~ser/styles/common.css";</style>
+</head>
+<body>
+<div id="header">SVG::Graph</div>
+<div id="menu">
+<div class="sect1menu">
+<a href="#N1001C">What is it?</a>
+</div>
+<div class="sect1menu">
+<a href="#N10028">What's new?</a>
+</div>
+<div class="sect1menu">
+<a href="#N10034">Screenshot</a>
+</div>
+<div class="sect1menu">
+<a href="#N1005E">Why use it?</a>
+</div>
+<div class="sect1menu">
+<a href="#N10070">Getting it</a>
+</div>
+<div class="sect1menu">
+<a href="#N1009B">Why?</a>
+</div>
+<div class="sect1menu">
+<a href="#N100E6">Dependancies</a>
+</div>
+<div class="sect1menu">
+<a href="#N100EF">Usage</a>
+</div>
+<div class="sect1menu">
+<a href="#N10100">Notes</a>
+</div>
+<div class="sect1menu">
+<a href="#N10127">Bugs</a>
+</div>
+<div class="sect1menu">
+<a href="#N1013D">Repository</a>
+</div>
+</div>
+<div id="content">
+<p></p>
+  0.6.1
+  <a name="N1001C">
+<div class="sect1">
+<h2>What is it?</h2>
+<p>SVG:::Graph is a pure Ruby library for generating charts, which are
+    a type of graph where the values of one axis are not scalar. SVG::Graph
+    has a verry similar API to the Perl library SVG::TT::Graph, and the
+    resulting charts also look the same. This isn't surprising, because
+    SVG::Graph started as a loose port of SVG::TT::Graph, although the
+    internal code no longer resembles the Perl original at all.</p>
+<p>SVG::Graph isn't only for charts. With version 0.4.0, support for
+    Plot charts was added, so scalar data may now be charted.</p>
+</div>
+</a>
+  <a name="N10028">
+<div class="sect1">
+<h2>What's new?</h2>
+<p>You can find that out in the <a href="changelog.html">change log.</a>
+</p>
+</div>
+</a>
+  <a name="N10034">
+<div class="sect1">
+<h2>Screenshot</h2>
+<p>Gotta have one.</p>
+<CENTER>
+<OBJECT TYPE="image/svg+xml" DATA="images/pie.svg" WIDTH="640" HEIGHT="480"></OBJECT></CENTER>
+<p>Here's a PNG version of the above image for the
+    SVG-challenged:</p>
+<CENTER>
+<IMG SRC="images/pie.png"></CENTER>
+<p>The SVG version is <em>much</em> cooler. <a href="screenshots.html">More screenshots are available</a>.</p>
+</div>
+</a>
+  <a name="N1005E">
+<div class="sect1">
+<h2>Why use it?</h2>
+<p>If you're a Ruby programmer, you can't use SVG::TT::Graph directly.
+    This package is for you.</p>
+<p>If you want one of the features that this package has that the Perl
+    version doesn't, and you don't mind doing your graph code in Ruby, then
+    this package is for you.</p>
+<p>If you want to generate SVGs that aren't CSS styled (and work with
+    more SVG renderers), use this package.</p>
+<p>If you're a Perl wienie or you have something against Ruby, use
+    SVG::TT::Graph. If it doesn't provide you with the features you want, hack
+    it yourself.</p>
+</div>
+</a>
+  <a name="N10070">
+<div class="sect1">
+<h2>Getting it</h2>
+<p>The source archives contain the example script(s) and an install
+    script. Documentation must be downloaded separately.<ul>
+<li>
+<p>
+<a href="http://www.germane-software.com/archives/svg_graph_0.6.1.tgz">Gzipped
+          sources</a>
+</p>
+</li>
+<li>
+<p>
+<a href="http://www.germane-software.com/archives/svg_graph_api_0.6.1.tgz">Gzipped
+          documentation</a>
+</p>
+</li>
+<li>
+<p>
+<a href="http://www.germane-software.com/archives/svg_graph_0.6.1.zip">Zipped
+          sources</a>
+</p>
+</li>
+<li>
+<p>
+<a href="http://www.germane-software.com/archives/svg_graph_api_0.6.1.zip">Zipped
+          documentation</a>
+</p>
+</li>
+</ul>
+</p>
+</div>
+</a>
+  <a name="N1009B">
+<div class="sect1">
+<h2>Why?</h2>
+<p>The SVG::TT:Graph package is just fine. It lacked a couple of
+    features that I wanted, and it was in Perl<SUP><A href="#N100A2">1</A></SUP>, so I re-implemented it.</p>
+<p>SVG::Graph is not a straight port of SVG::TT::Graph, because the
+    Perl version uses templates, and I don't believe that this is a job for
+    templates. Templates are great when you have lots of context containing a
+    little bit of evaluated code, but the Graph classes are mostly code with a
+    little SVG; therefore, it makes more sense (and is a hell of a lot more
+    readable) to have the SVG embedded in the code rather than vice versa.
+    However, some of the logic was directly cut and paste out of
+    SVG::TT::Graph, as was the entire CSS code and chunks of the
+    documentation, and the part of the API that the user sees is almost
+    identical to the original.</p>
+<p>In version 0.2.0 I completely refactored the code to make it more
+    modular. As a result, the core Graph class contains most of the graph
+    drawing primatives, and the specializations (Bar, BarHorizontal, Line,
+    Pie, etc.) only draw the plot itself. This results in many fewer lines of
+    code, and that code is more robust. SVG::TT::Graph re-implemented most of
+    the code for every plot type, whereas SVG::Graph reuses most of the
+    code.</p>
+<p>I intend SVG::Graph to have more features than SVG::TT::Graph, which
+    is the main reason for the re-implementation. One such feature is the
+    ability to change the stacking of the data sets. For instance, SVG::Graph
+    allows you to place the data bars from multiple data sets on the same
+    graph side-by-side, rather than overlapping.</p>
+<p>SVG::Graph also has an option to disable CSS styling of the graphs.
+    This has a number of consequences, both positive and negative. The SVGs
+    generated can be larger without CSS, and they are harder to dynamically
+    style (you can't use your own styles with CSS disabled). However, a number
+    of SVG renderers do not support or do not fully support CSS in SVG (KSVG
+    in Konqueror and librsvg, for instance). Adobe and Batik both support CSS,
+    so if those are your targets, you can use CSS. For maximum compatability,
+    disable CSS with the :no_css attriibute.</p>
+<p>The currently supported graph types are:</p>
+<ul>
+<li>
+<p>Bar</p>
+</li>
+<li>
+<p>BarHorizontal</p>
+</li>
+<li>
+<p>Line</p>
+</li>
+<li>
+<p>Pie</p>
+</li>
+<li>
+<p>Plot (this is scalar data)</p>
+</li>
+<li>
+<p>TimeSeries (also scalar data, with one axis being dates)</p>
+</li>
+<li>
+<p>Schedule (scalar time range data, with non-scalar Y axis)</p>
+</li>
+</ul>
+</div>
+</a>
+  <a name="N100E6">
+<div class="sect1">
+<h2>Dependancies</h2>
+<p>REXML 3.0+, or Ruby 1.8+. If you want to use the SVG compression
+    feature, which generates zlib compressed SVGs, you must also have the Ruby
+    zlib library installed.</p>
+</div>
+</a>
+  <a name="N100EF">
+<div class="sect1">
+<h2>Usage</h2>
+<p>There's API documentation available, either <a href="http://www.germane-software.com/software/SVG/SVG::Graph/doc">online</a>
+    or for <a href="http://www.germane-software.com/archive/svg_graph_api_0.6.1.tgz">download</a>.
+    Or, you can use rdoc to generate it yourself. The API documentation is
+    pretty comprehensive (Leo Lapworth did a really good job on the docs, and
+    I stole most of them), and there's an example application in the main
+    directory.</p>
+</div>
+</a>
+  <a name="N10100">
+<div class="sect1">
+<h2>Notes</h2>
+<a name="N10105">
+<div class="sect2">
+<h3>SVG feature support</h3>
+<p>Some SVG renderers (librsvg) do not understand CSS. This is a
+      problem with Perl's SVG::TT::Graph, because <em>all</em> of
+      the styling of the charts it generates is done with CSS. SVG::Graph is
+      able to inline the styles, rendering graphs that are compatible with
+      more viewers.</p>
+<p>The Pie chart uses the feGaussianBlur filter to generate the
+      shadow, whiich is also unsupperted by some renderers (librsvg). The
+      shadow will not look as smooth on those displays, although it will
+      render.</p>
+</div>
+</a>
+    <a name="N10114">
+<div class="sect2">
+<h3>Sizes</h3>
+<p>The bar charts PNGs tend to be smaller than the uncompressed SVGs.
+      In the best case (for PNG), the PNG is 66% of the size of the
+      uncompressed SVG.</p>
+<p>For line and pie charts, which are a little more visually complex,
+      the SVGs are smaller than the PNGs. In the best case, the PNG is 130%
+      the size of the SVG. In the worst case, the PNG is 220% the size of the
+      uncompressed SVG.</p>
+<p>The compressed SVGs are always much smaller than the PNGs. In the
+      best case (a vertical bar chart), the PNG is 4.4 times the size of the
+      compressed SVG, and in the worst case (for a pie chart), it is over 12
+      times the size of the compressed SVG.</p>
+<p>These values were measured with inline styled SVGs, and the PNGs
+      were reduced to 8-bit, indexed images, and were crushed with
+      pngcrush.</p>
+</div>
+</a>
+</div>
+</a>
+  <a name="N10127">
+<div class="sect1">
+<h2>Bugs</h2>
+<p>SVG::Graph probably contains bugs. In fact, it is probably mostly
+    bugs, held together with some working code around them. In particular,
+    SVG::Graph is probably really intolerant of *your* bugs, and is likely
+    entirely unhelpful in helping you track down problems. We can only pray
+    that this situation improves<SUP><A href="#N1012E">2</A></SUP>.</p>
+<p>There is a <a href="http://www.germane-software.com/cgi-bin/roundup/svg-graph">bug and
+    feature request database</a>; use this, and please create a user
+    account if you don't have one, so that I can email you if I have
+    questions. Alternatively, post anonymously, and check the database
+    often.</p>
+</div>
+</a>
+  <a name="N1013D">
+<div class="sect1">
+<h2>Repository</h2>
+<p>The sourcecode repository is a <a href="http://subversion.tigris.org">Subversion</a> repository, located
+    <a href="http://www.germane-software.com/repositories/public/SVG">here</a>.</p>
+</div>
+</a>
+</div>
+<div id="footnotes">
+<div class="footnote">
+<div class="footnotenum">
+<A name="N100A2">1)</A>
+</div>
+<p>Perl is from Hell. The language is bad enough, but working with
+        the package system -- CPAN, etc. -- is an exercize in masochism. I'd
+        rather chew on glass.</p>
+</div>
+<div class="footnote">
+<div class="footnotenum">
+<A name="N1012E">2)</A>
+</div>
+<p>Prayer is much more effective when accompanied by sums of cash
+        sent to the author.</p>
+</div>
+</div>
+<div id="footer">
+<div style="float:right">Copyright  Sean Russell</div>
+					[ <a href="http://www.germane-software.com/~ser">Main</a> ]
+				</div>
+</body>
+</html>