Skip to main content

Displaying Graph Using HighCharts

Submitted by amitsedai on
HighCharts is a charting library tool made freely available for non commercial usage. Drupal HighCharts 2.x has no other module dependency except that HighCharts library needs to be downloaded from here. There are a huge variety of options made available in HighCharts API which can be used for manipulation and for additional info. The example below is a Line Chart uses Drupal HighCharts version 2.x <?php /* Render Line Charts using Drupal Highcharts 2.x */ function jicustom_chart_render($chart_arr){ $options = new stdClass(); // Diable credits. $options->credits->enabled = FALSE; // Chart. $options->chart = (object)array( 'renderTo' => 'container', 'type' => 'line', ); $options->yAxis->title->text = "Y-axis Label"; $options->xAxis->title->text = "X Axis Label Here" ; //Configurable depending on the range for Y axis. If left blank, it gets auto-calculated $options->yAxis->min=0; $options->yAxis->max=100; // Title. $options->title->text = t('Chart Header Title'); $options->title->x = -20; $options->subtitle->text = t('Additional Info Here'); $options->subtitle->x = -20; // Tooltip. // On hovering over a point in the line chart, this tool tip gets displayed $options->tooltip->formatter = "function() {return ''+ this.series.name +': X axis data: '+ this.x +', Y-axis data: '+ this.y;}"; $options->legend= (object)array( 'layout' => 'vertical', 'align' => 'right', 'verticalAlign' => 'top', 'x' => -10, 'y' => 100, 'borderWidth' => 0 ); $options->series = array(); $series = new StdClass(); $series->type = 'line'; $series->name = 'Series Name'; // One can add multiple series for selection as well $series->data = array(); foreach ($chart_arr as $key => $value) { $series->data[] = array($key, $value)); } $options->series[] = $series; $series = NULL; if (is_object($options)) { // Optionally add styles or any other valid attributes, suitable for // drupal_attributes(). $attributes = array('style' => array('height: 600px;')); return highcharts_render($options, $attributes); //Main Function that does rendering of the graph } } ?> -- Source http://webwash.net/tutorials/intro-visualization-api-part-2-highcharts-and-code http://drupalcode.org/project/highcharts.git/blob/refs/heads/7.x-2.x:/README.md Line Charts: http://docs.highcharts.com/#line-chart