Create Highcharts Line Chart from Pivot Table
In many cases your reports return multiple columns of data. If you want to create simple two axis reporting on this data with a JavaScript chart, you can create a Pivot Table on the report and then associate a chart with that Pivot Table.
This article provides a step by step example of creating a Highcharts Line Chart using the results from a Pivot Table.
Highcharts documentation on Line Chart API:
http://www.highcharts.com/demo/line-basic
http://api.highcharts.com/highcharts#plotOptions.line
Note: The format of the Report and Chart editors is slightly different in Version 3.
1. Select or Create a Report
In this example, we use an existing report that returns multiple columns of data
2. Add Pivot
- Navigate to Charts and Pivots tab
- Click "+ Pivot" button
3. Define Pivot Parameters
In this example, we pivot on the calendar_date for a time series and will display just the totals of the sale dollars.
4. Full Pivot Editor Displays
Input a meaningful Name and adjust any values on the Pivot Editor as needed
NOTE: In this example, the defaults are left as is. The two columns for this Pivot are "calendar date" and "total amount"
5. Associate a Chart with the Pivot Table
- Navigate to the Pivot Charts tab
- Click "+ Chart" button
5.1. Select Chart type
Select Highcharts Line for Chart Type.
Save
6. Full Chart Editor Displays
- Input a meaningful Name for your chart
- Optionally edit X-axis title
- Optionally edit Y-axis title
Save & Publish
