PHP MySQL GD Graph

[jawood]

Hoping someone can help me with a problem I having with drawing a line graph with gd php mysql

 

Am trying to draw a simple line graph getting data from a MySQL database. attached is the code:-

 

I just get lots of rubbish characters on the screen. If I echo the contents of the fetched data it is correct and if I echo the $x2 and $y2 the data looks fine.

 

Am at a loss!

 

Any ideas would be appreciated.

 

This is the page: www.inshome.net.au/test.php

graph.php

Edited February 4, 2015 by jawood

[requinix]

1. Stop echoing stuff. You're messing up the image.

2. You're outputting a JPEG so don't claim it's a image/png. Should be an image/jpeg.

 

With those two changes you should get an actual image. Is the image correct? If not, post it and explain why it's wrong.

[jawood]

Thanks for your input, that seems to have fixed it.

 

I only used the echo to test that I was getting the right data thru.

 

One more thing thou how do I change the scale of the vertical axis?

Edited February 4, 2015 by jawood

[requinix]

Attachments are annoying.

<?php
    $page_title = 'INS Arduino Temperature Sensor Graph';

    include "./includes/dbconnect.php";

    $qt=mysql_query("SELECT event, dht22temp FROM sensordata ORDER BY id DESC LIMIT 12");

    header ("Content-type: image/png");
            
    $x_gap=40; // The gap between each point in y axis

    $x_max=$x_gap*13; // Maximum width of the graph or horizontal axis
    $y_max=250; // Maximum  hight of the graph or vertical axis
    // Above two variables will be used to create a canvas of the image//

    $im = @ImageCreate ($x_max, $y_max)
    or die ("Cannot Initialize new GD image stream");

    $background_color = ImageColorAllocate ($im, 234, 234, 234);
    $text_color = ImageColorAllocate ($im, 233, 14, 91);
    $graph_color = ImageColorAllocate ($im,25,25,25);


    $x1=0;
    $y1=0;
    $first_one="yes";

    while($nt=mysql_fetch_array($qt)){
       
       echo "$nt[event], $nt[dht22temp] ";
       $x2=$x1+$x_gap; // Shifting in X axis
       $y2=$y_max-$nt[dht22temp]; // Coordinate of Y axis
       ImageString($im,2,$x2,$y2,$nt[event],$graph_color); 
       //Line above is to print month names on the graph
       if($first_one=="no"){ // this is to prevent from starting $x1= and $y1=0
        imageline ($im,$x1, $y1,$x2,$y2,$text_color); // Drawing the line between two points
       }
       
       $x1=$x2; // Storing the value for next draw
       $y1=$y2;
       $first_one="no"; // Now flag is set to allow the drawing
    }
    ImageJPEG ($im);
    

?>

[requinix]

Currently there is no scale, which means you have to add it first. There's two places with $y2 that you can scale it:

$y2 = $yscale1 * ($y_max - $yscale2 * $nt["dht22temp"]);

Notice the quotes with the array key. dht22temp is a string and strings need quotes. Do the same for event.

 

You might want both $yscale1 and $yscale2, or maybe just one of them. Start with 1 and adjust in small increments until you're satisfied.

[edit] You also need to make sure you account for the possible values of dht22temp: one image now may look good but another image with different values (if that's possible) may be different.

Edited February 4, 2015 by requinix

[jawood]

thanks..

 

If I change $yscale1 to anything but 1 I get no line on the graph.

If I set $yscale1 to 1 and change $yscale2 the drawn line moves up the graph but the space between each point on the vertical axis stays the same.

As its a temperature log and temperature changes are only small 1 or 2 degrees throughout the day a small step in the line graph is hard to see.

Im not sure the above is achieving this goal.

[requinix]

How about producing some sample images? And being more precise than "anything but 1": 0.99999 is "anything but 1" but you'll get just about the same result, so clearly there's more to it than "anything but 1".