Sparkline PHP Graphing Library

Tagged:  

If you are creating an application or widget that deals with complex data such as a stock ticker you probably want to graph the data. Sparklines are a great way to graph such data in a small space. In fact it is amazing how much information you can get by just a quick look at a Sparkline.

Below is an example of a Sparkline from http://sparkline.org/.

Examples

Back in the dot-com heyday, you might remember that Cisco, EMC, Sun, and Oracle were nicknamed "the four horsemen of the Internet". You might now say: "companies that ride together, slide together." Large 10-year charts of these four stocks.

 
  5-Year Close High Low
Cisco 19.55 80.06 8.60
EMC 13.05 101.05 3.83
Sun 5.09 64.32 2.42
Oracle 13.01 43.31 7.32

The below code example is how you make a simple bar graph Sparkline.

 setBarWidth(4);
 
 // Set the spacing between the bars
 $graph->setBarSpacing(2);
 
 // Add a color called "mygray" to the available color list
 $graph->setColorHtml("mygray", "#424542");
 
 // Set the background color to this new color
 // As of 0.2, if you didn't set the color beforehand,
 // your background would be black
 $graph->setColorBackground('mygray');
 
 // Begin the loop to add the data
 foreach ($data as $key => $value) {
 
 // Add the data
 // This will make one white bar with the relative value
 // of $value
 $graph->setData($key, $value, 'white');
 }
 
 // Draw all necessary objects for our graph
 // The height will be 16
 $graph->render(16);
 
 // Displays the graph by sending a 'Content-type: image/png'
 // header then outputting the image data
 $graph->output();
?>

You can get more information about the Sparklines PHP Graphing library at http://sparklines.org.

Now that you have the tools to create a Sparkline go make a cool new application or widget that use Sparklines.

Just an FYI, the bottom link goes to the wrong site.

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <pre> <div> <blockquote> <object> <embed> <img> <param>
  • Lines and paragraphs break automatically.
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options

CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.
Copy the characters (respecting upper/lower case) from the image.