Data Schema - Tutorial
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_charts', // 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
);
?>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_charts', // 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
);
?>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.
How to make the examples work?
I was testing the charts module using the tutorial and could not make it work.
Can anyone post a complete tutorial as to how the charts module work?
Thanks.
PS. I was using the following steps:
1) download and enable the charts.module for my drupal 6 test site.
2) configure the module using admin/settings/charts, and configure it to use google charts
3) created a new blog, copied and pasted either example 1 and example 2 into the blog.
4) make sure that the PHP code is selected as input format.
Neither example 1 nor example 2 show any charts. In fact the blog is shown as empty with no content unless in editing mode.
I added charts_chart($chart) into the code and it does not help either.
Add return charts_chart($chart);
derekhu,
You have all the steps correct, you just need to add "return charts_chart($chart);" instead of "charts_chart($chart)". The steps you define are good. Really the only code you must have to create a chart is the "return charts_chart($chart)" and an array of data for $chart. Here are the steps if you still have trouble with it.
To minimize the confusion, let's use $example instead of $chart.
So like you said, derekhu, 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.