Share

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.