SVG::Graph looks awesome

Hello everyone,

I'm trying to install SVG::Graph through the link below.

http://www.germane-software.com/software/SVG/SVG::Graph/#N10064

I can't seem to figure out how to install this software on my Windows
2000 machine. I need to use a voice dictation software package called
Dragon NaturallySpeaking on Windows 2000.

I would greatly appreciate any suggestions that may enable me to use
this two-dimensional plotting routine.

Thank you,

Todd

download the .zip package. Then unzip it and open a prompt.
go to the directory and type:
ruby install.rb
Now it is installed (it is on my xp box)

···

il 15 Jun 2004 18:52:30 -0700, piir@earthlink.net (Todd Gardner) ha scritto::

Hello everyone,

I'm trying to install SVG::Graph through the link below.

gabriele renzi <surrender_it@remove.yahoo.it> wrote in message news:<u0pvc0d219195kb9u2c5nin4bon55acbvu@4ax.com>...

il 15 Jun 2004 18:52:30 -0700, piir@earthlink.net (Todd Gardner) ha
scritto::

>Hello everyone,
>
>I'm trying to install SVG::Graph through the link below.
>

download the .zip package. Then unzip it and open a prompt.
go to the directory and type:
ruby install.rb
Now it is installed (it is on my xp box)

Hello Gabriele,

I have done that however, I don't know it's working right. I'm trying
to run that code for Line.rb from the site
http://www.germane-software.com/software/SVG/SVG::Graph/doc/
->SVG::Graph::Line.

The code does not generate any graphics, only text is generated in
SciTE 1.59. What do I have to install or what am I doing wrong?

Thank you,

Todd
=Output for Line.rb=============================================

rubyw Line.rbw

Content-type: image/svg+xml

<?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&quot;&gt;
<svg xmlns:xlink='http://www.w3.org/1999/xlink&#39; viewBox='0 0 300 500'
height='500' width='300' xmlns='http://www.w3.org/2000/svg&#39;&gt;
    <!-- \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->
    <!-- Created with SVG::Graph -->
    <!-- Sean Russell -->
    <!-- Based on SVG::TT::Graph for Perl by Leo Lapworth & Stephan
Morgan -->
    <!-- //////////////////////////////////////////////////////////////////-->
  <defs>
    <style type='text/css'> <![CDATA[/* Copy from here for
external style sheet */
..svgBackground{
  fill:#ffffff;
}
..graphBackground{
  fill:#f0f0f0;
}

/* graphs titles */
..mainTitle{
  text-anchor: middle;
  fill: #000000;
  font-size: 16px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}
..subTitle{
  text-anchor: middle;
  fill: #999999;
  font-size: 14px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..axis{
  stroke: #000000;
  stroke-width: 1px;
}

..guideLines{
  stroke: #666666;
  stroke-width: 1px;
  stroke-dasharray: 5 5;
}

..xAxisLabels{
  text-anchor: middle;
  fill: #000000;
  font-size: 12px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..yAxisLabels{
  text-anchor: end;
  fill: #000000;
  font-size: 12px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..xAxisTitle{
  text-anchor: middle;
  fill: #ff0000;
  font-size: 14px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..yAxisTitle{
  fill: #ff0000;
  text-anchor: middle;
  font-size: 14px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..dataPointLabel{
  fill: #000000;
  text-anchor:middle;
  font-size: 10px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}

..staggerGuideLine{
  fill: none;
  stroke: #000000;
  stroke-width: 0.5px;
}

/* default line styles */
..line1{
  fill: none;
  stroke: #ff0000;
  stroke-width: 1px;
}
..line2{
  fill: none;
  stroke: #0000ff;
  stroke-width: 1px;
}
..line3{
  fill: none;
  stroke: #00ff00;
  stroke-width: 1px;
}
..line4{
  fill: none;
  stroke: #ffcc00;
  stroke-width: 1px;
}
..line5{
  fill: none;
  stroke: #00ccff;
  stroke-width: 1px;
}
..line6{
  fill: none;
  stroke: #ff00ff;
  stroke-width: 1px;
}
..line7{
  fill: none;
  stroke: #00ffff;
  stroke-width: 1px;
}
..line8{
  fill: none;
  stroke: #ffff00;
  stroke-width: 1px;
}
..line9{
  fill: none;
  stroke: #ccc6666;
  stroke-width: 1px;
}
..line10{
  fill: none;
  stroke: #663399;
  stroke-width: 1px;
}
..line11{
  fill: none;
  stroke: #339900;
  stroke-width: 1px;
}
..line12{
  fill: none;
  stroke: #9966FF;
  stroke-width: 1px;
}
/* default fill styles */
..fill1{
  fill: #cc0000;
  fill-opacity: 0.2;
  stroke: none;
}
..fill2{
  fill: #0000cc;
  fill-opacity: 0.2;
  stroke: none;
}
..fill3{
  fill: #00cc00;
  fill-opacity: 0.2;
  stroke: none;
}
..fill4{
  fill: #ffcc00;
  fill-opacity: 0.2;
  stroke: none;
}
..fill5{
  fill: #00ccff;
  fill-opacity: 0.2;
  stroke: none;
}
..fill6{
  fill: #ff00ff;
  fill-opacity: 0.2;
  stroke: none;
}
..fill7{
  fill: #00ffff;
  fill-opacity: 0.2;
  stroke: none;
}
..fill8{
  fill: #ffff00;
  fill-opacity: 0.2;
  stroke: none;
}
..fill9{
  fill: #cc6666;
  fill-opacity: 0.2;
  stroke: none;
}
..fill10{
  fill: #663399;
  fill-opacity: 0.2;
  stroke: none;
}
..fill11{
  fill: #339900;
  fill-opacity: 0.2;
  stroke: none;
}
..fill12{
  fill: #9966FF;
  fill-opacity: 0.2;
  stroke: none;
}
/* default line styles */
..key1,.dataPoint1{
  fill: #ff0000;
  stroke: none;
  stroke-width: 1px;
}
..key2,.dataPoint2{
  fill: #0000ff;
  stroke: none;
  stroke-width: 1px;
}
..key3,.dataPoint3{
  fill: #00ff00;
  stroke: none;
  stroke-width: 1px;
}
..key4,.dataPoint4{
  fill: #ffcc00;
  stroke: none;
  stroke-width: 1px;
}
..key5,.dataPoint5{
  fill: #00ccff;
  stroke: none;
  stroke-width: 1px;
}
..key6,.dataPoint6{
  fill: #ff00ff;
  stroke: none;
  stroke-width: 1px;
}
..key7,.dataPoint7{
  fill: #00ffff;
  stroke: none;
  stroke-width: 1px;
}
..key8,.dataPoint8{
  fill: #ffff00;
  stroke: none;
  stroke-width: 1px;
}
..key9,.dataPoint9{
  fill: #cc6666;
  stroke: none;
  stroke-width: 1px;
}
..key10,.dataPoint10{
  fill: #663399;
  stroke: none;
  stroke-width: 1px;
}
..key11,.dataPoint11{
  fill: #339900;
  stroke: none;
  stroke-width: 1px;
}
..key12,.dataPoint12{
  fill: #9966FF;
  stroke: none;
  stroke-width: 1px;
}

..keyText{
  fill: #000000;
  text-anchor:start;
  font-size: 10px;
  font-family: "Arial", sans-serif;
  font-weight: normal;
}
/* End copy for external style sheet */
]]></style>
  </defs>
    <!-- include default stylesheet if none specified -->
    <!--SVG Background-->
  <rect x='0' class='svgBackground' y='0' height='500' width='300'/>
  <g transform='translate( 50.2 10 )'>
    <rect x='0' class='graphBackground' y='0' height='471'
width='160.8'/>
    <path class='axis' d='M 0 0 v471' id='xAxis'/>
    <path class='axis' d='M 0 471 h160.8' id='yAxis'/>
    <text x='0.0' class='xAxisLabels' y='486' style='text-anchor:
middle'>Jan</text>
    <text x='68.4' class='xAxisLabels' y='486' style='text-anchor:
middle'>Feb</text>
    <text x='136.8' class='xAxisLabels' y='486' style='text-anchor:
middle'>Mar</text>
    <text x='-3' class='yAxisLabels' y='475.0' style='text-anchor:
end'>12.0</text>
    <text x='-3' class='yAxisLabels' y='430.3' style='text-anchor:
end'>15.465</text>
    <path class='guideLines' d='M0 426.3 h160.8'/>
    <text x='-3' class='yAxisLabels' y='385.6' style='text-anchor:
end'>18.93</text>
    <path class='guideLines' d='M0 381.6 h160.8'/>
    <text x='-3' class='yAxisLabels' y='340.9' style='text-anchor:
end'>22.395</text>
    <path class='guideLines' d='M0 336.9 h160.8'/>
    <text x='-3' class='yAxisLabels' y='296.2' style='text-anchor:
end'>25.86</text>
    <path class='guideLines' d='M0 292.2 h160.8'/>
    <text x='-3' class='yAxisLabels' y='251.5' style='text-anchor:
end'>29.325</text>
    <path class='guideLines' d='M0 247.5 h160.8'/>
    <text x='-3' class='yAxisLabels' y='206.8' style='text-anchor:
end'>32.79</text>
    <path class='guideLines' d='M0 202.8 h160.8'/>
    <text x='-3' class='yAxisLabels' y='162.1' style='text-anchor:
end'>36.255</text>
    <path class='guideLines' d='M0 158.1 h160.8'/>
    <text x='-3' class='yAxisLabels' y='117.4' style='text-anchor:
end'>39.72</text>
    <path class='guideLines' d='M0 113.4 h160.8'/>
    <text x='-3' class='yAxisLabels' y='72.7' style='text-anchor:
end'>43.185</text>
    <path class='guideLines' d='M0 68.7 h160.8'/>
    <text x='-3' class='yAxisLabels' y='28.0' style='text-anchor:
end'>46.65</text>
    <path class='guideLines' d='M0 24.0 h160.8'/>
    <path class='line2' d='M0 471 M0 471 L0.0 -199.5 68.4 -870.0 136.8
-1317.0 '/>
    <circle cy='-199.5' class='dataPoint2' r='2.5' cx='0.0'/>
    <circle cy='-870.0' class='dataPoint2' r='2.5' cx='68.4'/>
    <circle cy='-1317.0' class='dataPoint2' r='2.5' cx='136.8'/>
    <path class='line1' d='M0 471 M0 471 L0.0 -65.4000000000001 68.4
-1540.5 136.8 -467.7 '/>
    <circle cy='-65.4000000000001' class='dataPoint1' r='2.5'
cx='0.0'/>
    <circle cy='-1540.5' class='dataPoint1' r='2.5' cx='68.4'/>
    <circle cy='-467.7' class='dataPoint1' r='2.5' cx='136.8'/>
    <g>
      <text x='0.0' class='dataPointLabel' y='-205.5' style=' stroke:
#fff; stroke-width: 2;'>15</text>
      <text x='0.0' class='dataPointLabel' y='-205.5'>15</text>
      <text x='68.4' class='dataPointLabel' y='-876.0' style=' stroke:
#fff; stroke-width: 2;'>30</text>
      <text x='68.4' class='dataPointLabel' y='-876.0'>30</text>
      <text x='136.8' class='dataPointLabel' y='-1323.0' style='
stroke: #fff; stroke-width: 2;'>40</text>
      <text x='136.8' class='dataPointLabel' y='-1323.0'>40</text>
      <text x='0.0' class='dataPointLabel' y='-71.4000000000001'
style=' stroke: #fff; stroke-width: 2;'>12</text>
      <text x='0.0' class='dataPointLabel'
y='-71.4000000000001'>12</text>
      <text x='68.4' class='dataPointLabel' y='-1546.5' style='
stroke: #fff; stroke-width: 2;'>45</text>
      <text x='68.4' class='dataPointLabel' y='-1546.5'>45</text>
      <text x='136.8' class='dataPointLabel' y='-473.7' style='
stroke: #fff; stroke-width: 2;'>21</text>
      <text x='136.8' class='dataPointLabel' y='-473.7'>21</text>
    </g>
  </g>
  <g transform='translate(221.0 30)'>
    <rect x='0' class='key1' y='0' height='12' width='12'/>
    <text x='17' class='keyText' y='12'>Sales 2002</text>
    <rect x='0' class='key2' y='17' height='12' width='12'/>
    <text x='17' class='keyText' y='29'>Sales 2003</text>
  </g>
</svg>>Exit code: 0

=Code for Line.rb========================================================
require 'SVG/Graph/Line'

  fields = %w(Jan Feb Mar);
  data_sales_02 = [12, 45, 21]
  data_sales_03 = [15, 30, 40]

  graph = SVG::Graph::Line.new({
          :height => 500,
          :width => 300,
    :fields => fields,
  })

  graph.add_data({
          :data => data_sales_02,
    :title => 'Sales 2002',
  })

  graph.add_data({
          :data => data_sales_03,
    :title => 'Sales 2003',
  })

  print "Content-type: image/svg+xml\r\n\r\n";
  print graph.burn();

···

======================================================================

I have done that however, I don't know it's working right. I'm trying
to run that code for Line.rb from the site
RDoc Documentation -
>SVG::Graph::Line.

The code does not generate any graphics, only text is generated in

SciTE

1.59. What do I have to install or what am I doing wrong?

That is correct. It is not supposed to generate graphics per se, but it is
supposed to generate an SVG file which is a graphics format for viewing in
SVG viewers -- try saving the resulting text as "line.svg" and view
"line.svg" in your web browser. If you have the Adobe plugin installed (or
other plugins), then you can view the graphic just fine.

-austin

···

On Thu, 17 Jun 2004 11:28:26 +0900, Todd Gardner wrote:
--
austin ziegler * austin@halostatue.ca * Toronto, ON, Canada
software designer * pragmatic programmer * 2004.06.16
                                         * 22.45.06

Todd,

The output you posted looks like valid SVG (which is just XML data,
after all) -- have you tried loading it in a browser (w/SVG viewer) or
other graphics tool to check it?

You might check out the Batik viewer from the Apache XML folks if you
don't have another tool to load the graphics:
http://xml.apache.org/batik/

Lennon