Views Table Chart

This module has been modified as a more flexible alternative here: HighchartTable thanks to help from @RdeBoer.

This module enables a views style plugin called "Table Chart". The plugin converts views table output into a chart using the Highcharts third party library as a base and the jQuery HighchartTable library for conversion. The type of chart is configurable in the plugin settings. Chart types are:

• Column
• Line
• Area
• Spline
• Pie

Whats different about this module?

There are certainly other charting modules available and even ones also implementing the highcharts library however to my knowledge, this is the only one implementing the jQuery HighchartTable library as well. This alone makes the module unique in that it is a lightweight approach to creating a chart from a views table display that you already have. In my own research of using other charting modules, there always seem to be challenges in getting the field output to agree with the desired chart configurations. This module makes configuring a chart dead simple and eliminates all the complexities with field types and how they are rendered. The module simply looks for a value and renders it into the chart. It doesn't matter if the field is composed of rewritten output, whether it contains html tags, etc.... This means you can use global math expression & aggregated fields as output for the chart just fine.

Module Dependencies

• Views 3.x
• Libraries API 2.x

Third party Libraries

• Highcharts (Free for personal use but must purchase license to use on commercial site.)
• Highcharts Table

Instructions for useage

1. Download Highcharts library, unpack and rename to highcharts and move to sites/all/libraries. Example: sites/all/libraries/highcharts
2. Download Highcharts Table library, unpack and rename to highcharttable and move to sites/all/libraries. Example: sites/all/libraries/highcharttable
3. Install and enable Views Table Chart module.
4. Create a view of fields with labels specified.
5. Select Table Chart as the style under format settings in the view.
6. Select the type of chart you want to create. Default is Column.
7. Save your view and render the page, block etc... where the chart should appear.
8. Thats it! you should now have a chart.

Note: The table itself does not have to be viewable for the chart to work so if you only want the chart to appear without the underlying table, just add table.highchart {display: none;} to your stylesheet.