Create d3 Brush 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 using 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 d3 Brush chart using the results from a Pivot Table.
d3 documentation on Brush (Area) Chart API can be found at http://bl.ocks.org/mbostock/3883195
1. Select or Create Report
In this example, we use an existing report that returns multiple columns of data
2. Add Pivot
- Navigate to Charts & Pivots tab
- Click Add Pivot
3. Define Pivot Parameters
In this example, we pivot on the date and display just the totals of the sale Units
4. Full Pivot Editor Displays
- Input a meaningful Name
- Adjust any values on the Pivot Editor
Save
5. Associate a Chart with the Pivot Table
- Navigate to the Pivot Charts tab
- Click New chart
5.1. Choose a Chart type
- Select d3 Brush as Chart type
Save
6. Full Chart Editor Displays
Accept defaults or optionally change values for:
- Chart Name
- X-axis title
- Y-axis title
Save
7. Adjust Custom Charting Variables
- Navigate to the Custom Charting Variables tab
- Click the Edit icon for each of the variables
- Adjust the Value to match the names of the columns in the pivot
Save
8. Preview the Chart
8.1. Review the Chart
If the chart meets expectations:
- Close preview
- Enable & publish report
