Create d3 Line Chart - Time Series
This article provides a step by step example of how to create a d3 Line chart.
d3 documentation on Line Chart API can be viewed at http://bl.ocks.org/mbostock/3883245
1. Choose a Report that contains a Time Series
Choose a report that contains a time series. In this example the calendar_date column contains the time series data. In addition, limit the data collected to two columns. If you have a report with more than two columns, you can add a pivot (Add Pivot button) to limit the data to two columns OR remove the column from the SQL statement if not needed in the report.
2. Adjust Display Name for chart columns
Display Names may be changed by clicking on the name in the Display Name column
Ensure that the Display Name for the columns that you will be charting do not contain spaces
Save
3. Add the Chart
- Navigate to the Charts and Pivots tab
- Click the Add Chart button
3.1. Set Chart type
- Select d3 Line
Save
4. Full Chart Editor Displays
- Set Chart NameSelect Region data column as X-axis values
- Set X-axis title
- Set Y-axis title
Save & preview
5. Adjust Custom Charting Variables
- Click the gear to edit each of the Custom Charting Variable Values to match the names of your columns
- Set the Value to the Display Name used in Step 2 above
Save
More information about Custom Charting Variables can be found here
6. Preview Chart
If the chart meets expectations:
- Close preview
- Update live report
