Last updated April 4, 2009. Created by drewish on March 13, 2008.
Edited by bekasu, Darren Oh, brmassa. Log in to edit this page.
Thru examples, lets understand how to build a chart. Basicly, it follows the same structure as forms, with attributes using indexes with a '#'.
Example 1
<?php
$chart = array(
'#plugin' => 'google', // Google Charts API will be used
'#type' => 'line2D', // To show a simple 2D line chart
'#height' => 100, // in pixels
'#width' => 200, // in pixels
array(10, 20, 25, 35), // A simple list of values that will form the line on chart
);
return charts_chart($chart);
?>It's the simplest example possible. Note that plugin, type, height and #width are required for all charts.
Example 2
<?php
$chart = array(
'#plugin' => 'google', // Google Charts API will be used
'#type' => 'line2D', // To show a simple 2D line chart
'#height' => 100, // in pixels
'#width' => 200, // in pixels
'#color' => '336699', // background color, in RRGGBB format
'#title' => t('2015 Sales Projection'), // The chart title
array(
'#legend' => t('Revenue'),
100,
200,
250,
350
), // First series
array(
'#legend' => t('Profit'),
10,
20,
25,
35
), // Second series
);
return charts_chart($chart);
?>Now we changed the chart background and inserted a title over it #color and #title attributes.
Also, we will now display two series, named 'Revenue' and 'Profit', using the #legend attribute. You can see that the series attributes are in the same array as the values it seft.
Add return charts_chart($chart);
To minimize the confusion, let's use $example instead of $chart.
The first step is to download and enable charts.module for your Drupal 6 test site. Then configure the module in admin/settings/charts. This defines the default values for all the charts. Google Chart API should be selected as the plugin, but if it is not, then go ahead and select it since it is the simplest to work with. For the chart type, we can choose anything, but for this example let's choose a 2D pie chart. The other values such as width, height, and colors should be fine how they are, so just save the settings.
Now that you have all the default values defined for our charts, it is much easier to create a chart. Just create a new blog post (or any other content that can use the php input format) and be sure to select php as the input format. Now all you need to do to create a basic chart is give the post a title and paste the following code into the blog post:
<?php
$example = array(
array(5, 10, 25, 60), //Some basic data to test our chart
);
return charts_chart($example);
?>Now preview the post and you should see a simple 2D pie chart (as long as you selected Pie 2D as the default). If you completed the first steps and saved the default values for the chart settings, then this should work fine. If it does not, then make sure you save the settings in admin/settings/charts.
If you want to make your chart look a little nicer or use something aside from the default values, then you can define those values within your code. So if you want a 3D pie chart with a light grey background and a title of "Example," just define them like this:
<?php
$example = array(
'#type' => 'pie3D', // Display a 3D pie chart
'#color' => 'f0f0f0', // Background color, in RRGGBB format
'#title' => t('Example'), // Chart title
array(5, 10, 25, 60),
);
return charts_chart($example);
?>If you want the data labelled, then you can label them like this:
<?php
$example = array(
'#type' => 'pie3D', // Display a 3D pie chart
'#color' => 'f0f0f0', // Background color, in RRGGBB format
'#title' => t('Example'), // Chart title
array(
array('#value' => 60, '#label' => t('60%')),
array('#value' => 25, '#label' => t('25%')),
array('#value' => 10, '#label' => t('10%')),
array('#value' => 5, '#label' => t('5%')),
),
);
return charts_chart($example);
?>You can define any of the other variables in the same way. And it is perfectly fine to define #plugin, #type, #height, #width, etc. within your code too.
Comments
background color
concerning the chart background color, the tutorial is slightly wrong as the background color has to be provided in a separate dimension. The following array is correct:
<?php$example = array(
'#type' => 'pie3D', // Display a 3D pie chart
'#color' => array('background' => '#EFEFEF'), // Background color, in RRGGBB format
'#title' => t('Example'), // Chart title
array(
array('#value' => 60, '#label' => t('60%')),
array('#value' => 25, '#label' => t('25%')),
array('#value' => 10, '#label' => t('10%')),
array('#value' => 5, '#label' => t('5%')),
),
);
?>
enabling PHP code
Something that took me a bit to figure out:
If you want to have PHP code in regular page content (as opposed to a module, for example), you must a) enable the PHP filter module in the Drupal core, and b) set the input type to PHP code.
http://cannonblast.net/christofoo
how to add open flash chart plugin?
I use
'#plugin' => 'openflashchart',but it can't work.
who can help me?
thank you.
Learning Drupal.
What are possible option values?
I can see from the demo that using "google" uses the google api, or leaving it blank defaults to GD. What are the various plugin terms that can be substituted, and I echo the question: what term to use for open flash charts?
Also, is there a demonstration of using charts_views_api() available?
Sudo bring me the remote. Drupal Web Design
another example
Hi all,
Here is the example that works for chart-6.x-1.3.
Note that the #chart_id and #data array elements are required.
<?php
$chart = array(
'#chart_id' => 'someid', //required
'#type' => CHART_TYPE_PIE_3D, // Display a 3D pie chart
'#title' => t('Example'), // Chart title
'#data' => array( //required
0 => 60,
1 => 40),
'#labels' => array(
0 => '60%',
1 => '40%'),
'#size' => array('#width' => 300, '#height' => 150),
);
return chart_render($chart);
?>
-----------update------------
P.S. my mistake - this is true for the Chart API module (http://drupal.org/project/chart)
Status Report error
After loading charts with drush and enabling all the options except Flash charts, I have been having trouble making the examples work. I checked the status report and I see the following:
"Charts No Charts provider installed
Charts core module only provides a a common set of functions. You must install a Charts provider module to create charts."
Is this a real problem? Because I have all the options selected and the documentation doesn't seem to mention anything else... but the "simple" example kicks out all sorts of warnings and I get no chart...
Drupal 7.0