My favorites | Sign in
Project Home Downloads Wiki
Search
for
Examples  

examples
Updated Feb 4, 2010 by tjholowayhuk@gmail.com

#Charting examples

Simple chart

  $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => t('Servings'),
      '#type' => CHART_TYPE_PIE_3D,
    );
    
  $chart['#data']['fruits'] = 3;
  $chart['#data']['meats']  = 2;
  $chart['#data']['dairy']  = 5;

  echo chart_render($chart);

Labels, title styling, and chart size

  $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => chart_title(t('Servings'), 'cc0000', 15),
      '#type' => CHART_TYPE_PIE,
      '#size' => chart_size(400, 200),
    );
    
  $chart['#data']['fruits'] = 3;
  $chart['#data']['meats']  = 2;
  $chart['#data']['dairy']  = 5;

  $chart['#labels'][] = t('Fruits');
  $chart['#labels'][] = t('Meats');
  $chart['#labels'][] = t('Dairy');

  echo chart_render($chart);

Custom data colors

Alternatively use the the Color Schemes Hook which can be then associated to multiple charts containing some or all of the same content. You may want to consider chart_unique_color();

  $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => chart_title(t('Servings'), 'cc0000', 15),
      '#type' => CHART_TYPE_PIE,
      '#size' => chart_size(400, 200),
    );
    
  $chart['#data']['fruits'] = 3;
  $chart['#data']['meats']  = 2;
  $chart['#data']['dairy']  = 5;

  $chart['#labels'][] = t('Fruits');
  $chart['#labels'][] = t('Meats');
  $chart['#labels'][] = t('Dairy');
  
  $chart['#data_colors'][] = '00ff00';
  $chart['#data_colors'][] = 'ff0000';
  $chart['#data_colors'][] = '0000ff';

  echo chart_render($chart);

Line chart, legends, resolution adjustment, and label positioning

As you can see in the chart below, the resolution of the encoding type chosen does not reflect well with the data provided. So in the chart below it, we set "'#adjust_resolution' => TRUE,".

 $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => chart_title(t('Servings'), 'cc0000', 15),
      '#type' => CHART_TYPE_LINE,
      '#size' => chart_size(400, 200),
      '#adjust_resolution' => TRUE,
    );
    
  $chart['#data']['fruits'] = array(1, 3, 5, 4, 2);
  $chart['#data']['meats']  = array(2, 2, 4, 3, 1);
  $chart['#data']['dairy']  = array(5, 2, 3, 1, 2);

  $chart['#legends'][] = t('Fruits');
  $chart['#legends'][] = t('Meats');
  $chart['#legends'][] = t('Dairy');

  $chart['#data_colors'][] = '00ff00';
  $chart['#data_colors'][] = 'ff0000';
  $chart['#data_colors'][] = '0000ff';

  $chart['#mixed_axis_labels'][CHART_AXIS_Y_LEFT][0][] = chart_mixed_axis_range_label(0, 5);
  $chart['#mixed_axis_labels'][CHART_AXIS_Y_LEFT][1][] = chart_mixed_axis_label(t('Count'), 95);
  
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][1][] = chart_mixed_axis_label(t('Mon'));
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][1][] = chart_mixed_axis_label(t('Tue'));
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][1][] = chart_mixed_axis_label(t('Wed'));
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][1][] = chart_mixed_axis_label(t('Thu'));  
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][1][] = chart_mixed_axis_label(t('Fri'));
  $chart['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][2][] = chart_mixed_axis_label(t('Days of the week'), 50);

  echo chart_render($chart);

Grid lines and chart fill

  $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => chart_title(t('Servings'), 'cc0000', 15),
      '#type' => CHART_TYPE_LINE,
      '#size' => chart_size(400, 200),
      '#chart_fill' => chart_fill('c', 'eeeeee'),          
      '#grid_lines' => chart_grid_lines(20, 20, 1, 5),          
    );
    
  for ($i = 0; $i < 80; $i++){
    $chart['#data'][] = $i + rand(0, $i);
  }

  echo chart_render($chart);

Bar sizing & color mapping

Spacing and sizing of bars can be adjusted using the #bar_size attribute. Colors are mapped to content id's with chart_unique_color(id), no matter how many charts on the page use test_a, test_b, or test_c, they will always have the same corrosponding color.

  $chart = array(
      '#chart_id' => 'test_chart',
      '#title' => chart_title(t('Bar Chart'), '0000ee', 15),
      '#type' => CHART_TYPE_BAR_V_GROUPED,
      '#size' => chart_size(400, 200),
      '#grid_lines' => chart_grid_lines(30, 15),
      '#bar_size' => chart_bar_size(15, 5), 
    );
    
  $chart['#data'][] = array(40, 50, 70);
  $chart['#data'][] = array(60, 50, 30);
  $chart['#data'][] = array(40, 60, 20);
  
  $chart['#data_colors'][] = chart_unique_color('test_a');
  $chart['#data_colors'][] = chart_unique_color('test_b');
  $chart['#data_colors'][] = chart_unique_color('test_c');

  echo chart_render($chart);
Comment by kehanhar...@gmail.com, Apr 25, 2008

Creating a Map

It is now possible to create a map using the following code:

<?php
   $chart = array(
      '#chart_id' => 'test_chart',
      '#type' => CHART_TYPE_MAP,         //Map Type
      '#countries' => array(MG,KE,TN),   //Array of ISO country codes (2 letter codes)
      '#georange' => africa,                    //Geographic Range of the Map - continent name or 'world'
      '#data' => array(10,50,100),        //Value affects intensity of colours which will be in the range defined by #data_colours second and third elements
      '#data_colors' => array('ffffff', 'edf0d4', '13390a') //3 values for the colour (all other countries, start colour and end colour)
    );
echo chart_render($chart);
?>

This results in:

Comment by netsperi...@gmail.com, Aug 25, 2008

Here's a scatter plot of Drupal Userpoints (anonymous) by member!

Here's the code!

http://snippets.dzone.com/posts/show/5985

Comment by blaze.so...@gmail.com, Sep 21, 2008

This examples don't work in drupal. Do I need to install a module, where can I download the module from?

Comment by olli.k.a...@gmail.com, Nov 12, 2008

You need Drupal module from this project: http://drupal.org/project/chart

Comment by ryanmich...@gmail.com, Dec 11, 2008

$chart = array(

'#chart_id' => 'test_chart', '#title' => t('Servings'), '#type' => CHART_TYPE_PIE_3D,
);
$chart['#data']['fruits'] = 3; $chart['#data']['meats'] = 2; $chart['#data']['dairy'] = 5;

echo chart_render($chart);
Comment by project member tjholowayhuk@gmail.com, Apr 8, 2009

hha "This examples don't work in drupal. Do I need to install a module, where can I download the module from?"

this is why I left Drupal, to many people have no clue what they are doing... PHP makes me barf :P

Comment by MilaDany...@gmail.com, Apr 18, 2009

The simplest way to use it : 1. Activate into administer -> site building -> Modules -> PHP filter module 2. Create block in administer -> site building -> Blocks -> Add block 3. Change input format for the block into "PHP code" 4. Insert example php code into your block between <?php "example code goes here" ?> 5. Place your block in any egion of your page. 6. Look and feel happy :)

Comment by MilaDany...@gmail.com, Apr 18, 2009

you can download module from www.drupal.org

Comment by jerry.la...@gmail.com, Apr 24, 2009

Question. Can I use database queries as input?

Comment by empire.s...@gmail.com, Jul 1, 2009

great!

Comment by Brandon....@gmail.com, Sep 7, 2009

Keep in mind that the module itself will be calling out to Google's API. This API is served on an HTTP site and will cause error dialogs within IE if being called from an HTTPS site. These errors get old very quick and changing the settings within IE to ignore that error is not a preferred method.

Comment by luis.ave...@gmail.com, Oct 28, 2009

Great! I'll try the module for sure... Is there any workaround for using https without IE warnings? I'm just curious. Maybe modifying the code and loading these libraries from my local server?

Thanks for the module :)

Comment by davidwht...@gmail.com, Jan 29, 2010

Thanks for the module, works great. There's a bit to get ones head around but the functionality is there :)

Comment by kdkran...@gmail.com, Feb 7, 2010

Here's an example of how to graph statistics about your Drupal website:

<?php

function gen_cumulative_table($table = 'node', $id = 'nid', $qfragment = '', $points = 0, $timestamp = 0) {
  $data = array();
  $nbars = 15;
  
  $key = in_array($table, array('node', 'users')) ? 'created' : 'timestamp';
  $timestamp = $timestamp ? $timestamp : db_result(db_query('SELECT MIN(%s) FROM {%s} WHERE %s != 0', $key, $table, $id));
  if ($timestamp) {
    // one point per week (at least 15 points)
    if (!$points) {
      $points = max((time() - $timestamp) / (60*60*24*7), 15);
      while ($points > $nbars) {
        $points /= 2;
      }
    }
    $interval = round((time() - $timestamp) / ($points - 1), 0);
    $time = $timestamp;
    for ($i = 0; $i < $points; $i++) {
	  $data['date'][$i] = format_date($time, 'custom', 'm/d') ;	
      $data['count'][$i] = db_result(db_query('SELECT COUNT(DISTINCT(%s)) FROM {%s} WHERE %s <= %d AND %s != 0 %s', $id, $table, $key, $time, $id, $qfragment));
      $time += $interval;
    }
  }

  return $data;
}

$chart1data = array(  'data' => gen_cumulative_table());
$chart1max = max($chart1data[data][count]);
$chart1 = array(
  '#chart_id' => 'chart_h_nodes',
  '#title' => t($chart1max .' Recipies, menus, and other posts'),
  '#type' =>  CHART_TYPE_BAR_V_GROUPED,
  '#size' => chart_size(500, 200),
  '#chart_fill' => chart_fill('bg', 'f4f7e700'),   
  '#adjust_resolution' => TRUE,
);
$chart1['#data_colors'][] = '94CE18';    
$chart1['#data']['Actual'] = $chart1data[data][count];
$chart1['#mixed_axis_labels'][CHART_AXIS_Y_LEFT][0][] = chart_mixed_axis_range_label(0, $chart1max);
$chart1['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][0][] =  chart_mixed_axis_label($chart1data[data][date]);
print chart_render($chart1);


$chart2data = array(  'data' => gen_cumulative_table('users', 'uid'));
$chart2max = max($chart2data[data][count]);
$chart2 = array(
  '#chart_id' => 'chart_h_users',
  '#title' => t($chart2max.' Users'),
  '#type' =>  CHART_TYPE_BAR_V_GROUPED,
  '#size' => chart_size(500, 200),
  '#chart_fill' => chart_fill('bg', 'f4f7e700'),   
  '#adjust_resolution' => TRUE,
);
$chart2['#data_colors'][] = '94CE18';    
$chart2['#data']['Actual'] = $chart2data[data][count];
$chart2['#mixed_axis_labels'][CHART_AXIS_Y_LEFT][0][] = chart_mixed_axis_range_label(0, $chart2max);
$chart2['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][0][] =  chart_mixed_axis_label($chart2data[data][date]);
print chart_render($chart2);


$chart3data = array(  'data' => gen_cumulative_table('comments', 'cid'));
$chart3max = max($chart3data[data][count]);
$chart3 = array(
  '#chart_id' => 'chart_h_comments',
  '#title' => t($chart3max .' Comments'),
  '#type' =>  CHART_TYPE_BAR_V_GROUPED,
  '#size' => chart_size(500, 200),
  '#chart_fill' => chart_fill('bg', 'f4f7e700'),   
  '#adjust_resolution' => TRUE,
);
$chart3['#data_colors'][] = '94CE18';    
$chart3['#data']['Actual'] = $chart3data[data][count];
$chart3['#mixed_axis_labels'][CHART_AXIS_Y_LEFT][0][] = chart_mixed_axis_range_label(0, $chart3max);
$chart3['#mixed_axis_labels'][CHART_AXIS_X_BOTTOM][0][] =  chart_mixed_axis_label($chart3data[data][date]);
print chart_render($chart3);

?>

Comment by ruod...@gmail.com, Feb 8, 2010

cool

Comment by c0ley_yo...@yahoo.co.uk, Jun 11, 2010

This module is fantastic, and I've been busy creating several graphs. Only one issue - the graphs are generated as PNGs (no problem with that) without any alt text (which I have a slight problem with). Is there any way of setting the alternative text? I have a function which generates the graphs, so I'd love to be able to pass in the value of the alt text...

Comment by mhd...@gmail.com, Jul 2, 2010

How can I populate chart's labels? I'm using a mysql resultset and could fill in the data part.

$chart = array(
		'#chart_id' => 'Grafico_Prueba',
		'#title' => t('Categorías'),
		'#type' => CHART_TYPE_PIE_3D,
		);
		
while ($row=mssql_fetch_array($result)) {
		$c1=utf8_encode($row['Categoria']);
		$c2=$row['Total'];
		
		$chart['#data'][t("'" & $c1 & "'")] = $c2;
		$chart['#labels'][] = '"' & $c1 & '"'; 
		
	}

echo chart_render($chart);

Using this line for labels:

$chart['#labels'][] = '"' & $c1 & '"';

rendered chart has no labels at all.

Using this other, (") swap by (')

$chart['#labels'][] = "'" & $c1 & "'";

rendered chart has only one label with "0".

If I try this other one:

$chart['#labels'][] = t("'" & $c1 & "'");

same rendered chart with only one "0" label.

On every case, the rendered chart has the right portions with each size according to data. At the moment I couldn't display labels nor legends. I tried both with same results.

Any help would be appreciated. As you already should know, I'm just starting with PHP. Thanks for your time.

Comment by prettyki...@gmail.com, Jul 9, 2010

How can i generate a chart, that compare 2 differents data range?

Comment by alaintx...@gmail.com, Sep 30, 2010

Hi

I think i found a little bug in the module.

I was trying to create a SCATTER type chart, and i wasn't able to change the color the 'legends' adding this:

$chart['#data_colors'][]=chart_unique_color($nodes[$i]->nid);

Then i realized that this added $chco=color1,color2,color3 to the url instead of $chco=color1|color2|color3, and without the '|' caracter the color doesn't change. So I entered the '|' character by myself and it worked. (something like this:

for($i=0;$i<$nodeCount;$i++){
    	$color .= chart_unique_color($nodes[$i]->nid);
    	if($i!=$nodeCount-1) $color .= '|';
	$chart['#legends'][]=t($nodes[$i]->title);
}
$chart['#data_colors'][] = $color;

I hope someone finds this useful. Thank you for your work!

Comment by xurizae...@gmail.com, Dec 12, 2010

"Is there any workaround for using https without IE warnings?"

Yes, the same workaround as is requird for any HTTPS website referencing an external image - reference the image via HTTPS instead of HTTP.

Comment by alyushk...@gmail.com, May 14, 2011

Sorry, where should I put this peace of code?

Thank you

Comment by wict...@gmail.com, Aug 27, 2011

For Drupal 7 you should not use the last function: echo chart_render($chart); It returns a error.

But following: echo theme('chart', array('chart' => $chart));

Comment by ranj...@srijan.in, Sep 21, 2011

For Drupal 7 you can use return theme('chart', array('chart' => $chart));

Comment by i...@1stcd.co.uk, Oct 9, 2011

Are there any plans to make the map chart show individual towns using geolocation for example?

Comment by roby.bru...@gmail.com, Nov 16, 2011

Is it possible to get plots with unequally spaced data inserting something like cht=lxy chd=t:10,20,40,80,90,95,99|20,30,40,50,60,70,80|

-1|5,10,22,35,85

Comment by the.pun....@gmail.com, Dec 5, 2011

Drupal - The cowards never started -- and the weak died along the way.


Sign in to add a comment
Powered by Google Project Hosting