SVGraPHP

by: Jens
November 22, 2002
Version: 0.8.3
Type: Full Script
Category: Graphics
License: GNU General Public License
Description: Dynamic Graph drawn with SVG and PHP
<?

####################### Development Notes ##############################
/*
Snippet name: svgraphp Version 0.8.3

Developed by:
  Jens Pilemand Ottesen


If you do make improvements that can benefit other - please  do this:
  test your improvement.
  share at PHPBuilder.
  update the version number in name.
  describe you improvements below.
  Add your name to the Developer list above.

Development history (add it here when it's all done):
  Version 0.8.3: variable variables have been changed to:  ${str.$var}


Development in progress (to coordinate development):




######################### Apache configuration ####################################


mime-type file must contain: image/svg+xml svg svgz

You can often find the mime type file here:
"/etc/mime.types" or /etc/httpd/mime.types" or "/etc/http/conf/apache-mime.types"

config-file must containb: AddType application/x-httpd-php .php .php4 .phtml .svg .svgz

found at: "/etc/httpd/httpd.conf"

*/

################################### Variables ################################

$XasMonths = true;

$svgwidth=800;
$svgheight=400;
$graphheight = 300;
$graphwidth = 700;
$margin = 20;
$scaleSize = 125;   //Minimum value on Y-axis - use round numbers!
$minScaleCount = 5; //Maximum number of valuespoints on Y-axis



//serie colors
$serieAColor = 'green';
$serieBColor = 'orange';
$serieCColor = 'blue';
$serieDColor = 'purple';
$serieEColor = 'red';
$serieFColor = 'yellow';
$serieGColor = 'navy';
$serieHColor = 'gray';
$serieIColor = 'black';
$serieJColor = 'pink';

############################## Parameter passing ################################
/*
series are defined in the values of serieA=NAME... example:
    serieA=redhat
    serieB=mandrake
    serieC=turbo

the serievalues are then defined like NAME.N=VALUE. Where the first value of N = startDate... example:
    startDate=1
    endDate=3
    redhat1=225
    redhat2=325
    redhat3=1256
    mandrake3=556

store these parameters in a variable like this:
$parameters =  "?startMonth=1&endMonth=3&startYear=2002&serieA=redhat&serieB=mandrake";
$parameters .= "&redhat1=333&redhat2=444&mandrake1=0&mandrake2=555&mandrake3=666";

note that empty field should be written as zero



Usually a graph will be embedded in a another webpage. Do it like this:
<EMBED WIDTH="800" HEIGHT="400" SRC="svgraphp.svg<? echo $parameters; ?>" type="image/svg+xml" pluginspage="http://download.adobe.com/pub/adobe/magic/svgviewer/win/3.x/3.0/en/SVGView.exe" wmode="transparent">


############################## Permanent Code #################################
You don't need to alter anything below here.
*/
header("Content-type: image/svg+xml");
print('<?xml version="1.0" encoding="iso-8859-1"?>');
?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="<?=$svgwidth;?>px" height="<?=$svgheight;?>px"
xmlns="http://www.w3.org/2000/svg">


<?
$largest = 0;
$stop = false;
for ($a = A; !$stop; $a++){
  $thisSerie = ${'serie'.$a};
  if (!$thisSerie){ $stop=true; }
  else{
    for ($m = $startMonth; $m <= $endMonth; $m++){
      $thisValue = ${$thisSerie.$m};
      if ($thisValue > $largest){ $largest = $thisValue; }
    }
  }
}


//calculate scale for Y-Axis

$scaleCount = $largest / $scaleSize;
while ($scaleCount > $minScaleCount){
  $scaleSize *= 2;
  $scaleCount = $largest / $scaleSize;
}

$ySteps = $graphheight / ($scaleCount + 1);
$yPixelFactor = $scaleSize/$ySteps;

//write Y-Axis
for ($i = 0; $i <= $scaleCount + 1 ; $i++ ){
  $y = $graphheight - ($i * $ySteps);
  echo '<text x="'.$margin.'" y="'.$y.'" style="font-size:15;">'.$i * $scaleSize.'</text>';
  echo '<line x1="'.$margin.'" y1="'.$y.'" x2="780" y2="'.$y.'" stroke="gray" />';
}



//write series
$xSteps = $graphwidth / ($endMonth - $startMonth);
$dateYPos = $graphheight + 50;
$legendXPos = $margin;
$legendYPos = $graphheight + 70;
$legendTextYPos = $graphheight + 75;


$stop = false;
for ($a = A; !$stop; $a++){
  $thisSerie = ${'serie'.$a};
  if (!$thisSerie){ $stop=true; }
  else{
    //write legend
    $legendXPos += 70;
    $color = ${'serie'.$a.'Color'};
    echo '<rect x="'.$legendXPos.'" y="'.$legendYPos.'" width="8" height="8" fill="'.$color.'" stroke="'.$color.'" />';
    $legendXPos += 10;
    echo '<text x="'.$legendXPos.'" y="'.$legendTextYPos.'" style="font-size:15;">'.$thisSerie.'</text>';


    //write series
    $thisX = $margin + 40;
    $lastY = 0;
    for ($m = $startMonth; $m <= $endMonth; $m++){
      $thisValue = ${$thisSerie.$m};
      $thisY = $graphheight - ($thisValue/$yPixelFactor);
      if ($XasMonths){
        $dateX = $thisX - 20;
        echo '<text x="'.$dateX.'" y="'.$dateYPos.'" style="font-size:15;">'.date('M-y', mktime(0,0,0,$m,1,$startYear)).'</text>';
      }
      else{
        echo '<text x="'.$thisX.'" y="'.$dateYPos.'" style="font-size:15;">'.$m.'</text>';
      }
      if ($lastY > 0){
        echo '<line x1="'.$lastX.'" y1="'.$lastY.'" x2="'.$thisX.'" y2="'.$thisY.'" stroke-width="2" stroke="'.$color.'" />';
      }
      $lastY = $thisY;
      $lastX = $thisX;
      $thisX += $xSteps;
    }
  }
}

?>

<rect x="1" y="1" width="<? echo $svgwidth-4; ?>" height="<? echo $svgheight-4; ?>" fill="none" stroke="navy" stroke-width="2" />

</svg>
Comment and Contribute
0 Comments (click to add your comment)
Your comment has been submitted and is pending approval.

Author:
Jens
Comment:
Name/nickname:
Email:
Comment:
(Maximum characters: 1200). You have characters left.