GD2+ Pie Chart

Please Note: Due to running GD2.0.12 at the moment on this server, the anti-alias facility of the function had to be set to zero (the anti-alias effect is achieved through an iterated ImageCopyMerge loop which has snags in 2.0.12). As such, all the shown graphs look a tad jaggedy and don't really do the function justice. If you run a different version of GD I advise adding an anti-alias of between 10 and 20 to smooth the edges.

Note: My next 'on the agenda' task is compiling a class distribution of the DataGraphs which will involve slightly different calls and a better anti-aliasing algorythm. Feel free to use the single function distros for a while and upgrade to the class later on.

Download the GD2+ Pie Chart Function
downloaded 1738 times from this site.


This class is freely available for use in any non-profit applications, though a note to say you are using it would be appreciated. If you require it for a more commercial project, please contact me.

coloured pie chartThe pie chart function can be used to give a visual representation of data very easily.
Whether you want to show a mere two result (eg the results from a poll) or thirty, the same function call is used, just with different input arrays.

Additional parameters are available for controlling all the colours used, the height, the width, the 3D raised height, anti-alias strength and legend percentage toggle. Variables hardcoded within the function can be amended to set the edge gradient shading and the jpeg output compression.

gradient pie chartColours used in the graph can be defined by using a simple colour array and include the facility for running a segment gradient effect or passing each segment colour individually. The graph to the right shows a gradient from hex# '333333' to hex# 'FFFFFF' whereas the top graph has defined hex values for each segment.

The input array for the segment titles and values is a straight forward associative array which can be precompiled prior to the call and just passed as a reference. The legend will attempt to show as many titles as possible within the image height. These will be ordered largest/highest at the top and can hold as many as 50 characters (titles over 25 characters will span two lines). See the few sample calls below and the usage notes.

Sample Calls and Usage Notes

Warning Version 2.0.12 (and possibly 2.0.10 - 2.0.15) of the GD libraries has snags with the ImageCopyMerge function which is used in the anti-alias effect. Make certain you set anti-alias to zero for all troubled builds (noticable by the image suddenly becoming badly jagged and shades of black)

Function Parameters

pie_chart(
Data Array, (array) associative 'title'=>value, array of segment text and value pairs
Pie Width, (int) pixel width of pie chart only - image will be 200px wider due to legend
Pie Height, (int) pixel height of pie chart (and thus image height)
Save Name, (string) leave empty '' for direct browser output - XXXXX.png => png output, else jpeg
Colours Array, (array) associative array of hex values for colours - see below
Height 3D, (int) pixel raised height of 3D chart
Show Percents, (string) 'yes' => % values shown in legend, else no
Anti-Alias, (int) strength of antialiasing 0=off (needed for version 2.0.12 of GD) values 5 to 25 are suitable
);

All parameters except the first (the data) are optional and will default to values as defined in the actual function.

Sample Call: Gradient Segments - Browser Output

include_once('function_pie_chart.php');
$data = array('title 1'=>14, 'title 2'=>23, 'title 3'=>8, 'title 4'=>23, 'title 5'=>45, 'title 6'=>21);
$colours = array('bg'=>'C3DDEE','fg1'=>'333333','fg2'=>'FFFFFF');
pie_chart( $data, 140, 100, '', $colours, 12, 'no', 0);

Precompiling the associative array for the data tends to make the code more readable and thus easier to debug. Here we have six indices holding integer values.
The array of $colours below is where we define the processed colours for the background and segments. The 'bg' index should be self explanatory, holding a hex value for the image background. The next two are set index names to force a gradient process.
'fg1' => hex# - this is the colour used for the first segment (this will be the largest segment as the data array is sorted highest first before drawing commences).
'fg2' => #hex - this is the last colour used (smallest segment). All the segments in between will be shown in a colour determined as a proportioanl step from the fg1 colour to the fg2 colour.
Our call to pie_chart() passes the $data array, width, height, save name (here left blank to force direct browser output as png), the $colours array, the 3D height, toggle string for showing percentages in legend and finally the anti-alias (set to zero here - maybe due to using GD2.0.12).

Sample Call: Defined Colours - Server Saved JPEG Copy

include_once('function_pie_chart.php');
$data = array('title 1'=>14.82, 'title 2'=>23.01, 'title 3'=>8.69, 'title 4'=>23.19);
$colours = array(
            
'bg'=>'C3DDEE',
            
'colours'=>array(
                
'F49999',
                
'C47878',
                
'782121',
                
'953434',
                
'A94545'));
pie_chart( $data, 180, 140, 'graphs/pie_chart.jpg', $colours);

Similar to the first sample call, we precompile both the data array and colours array. This time though we want to define seperate colours for every segment in turn. Leaving out the 'fg1' and 'fg2' indices, we instead add an index called 'colours' which in turn is an array. Note: there must be at least as many indices in the $colours['colours'] array as there are in the data array. In the example above I have added one more value to the colours array than to the data array - the last colour will not be used.
The call to pie_chart is also very similar, passing the data array pointer, width, height, save name (as the last three characters are not 'png' the output will be a jpeg) and colour array pointer. The last parameters have been left out and will defer to their default values.
Actually, every parameter except the first (the data) can be left out.

SiteMap