You can build a Klip that uses buttons to dynamically change how the dates are grouped on the X:Axis. For example, when you click a button labelled Month, the dates on the X:Axis display the data in months, when you click a button labelled Quarter, the data displays in quarters.
To demonstrate how to do this, here is important information about my data set:
- Column A contains the dates in the format of 1-09-2018
- Column B contains an associated number (10)
- Column C contains an associated name of a color (Blue or Black)
To build this Kiip, drag in the following component types into the Klip editor.
- User Input Control
- Bar/Line Chart
- Button (for month)
- Button (for quarter)
To build the drop-down list so the user can select a color:
- Select the User Input Control component.
- Create a new variable called color with a Klip scope.
- For Control Label, type in an appropriate name, like Color.
- For the Values sub-component, select the color column in the data source.
- To get one unique instance of each color, select the three vertical dots and select Group.
To setup up the buttons:
Select Button 1
- Create a new variable called timefr and assign it a Klip scope.
- For Values sub-component, type: “Month”.
- For Labels sub-component, type: "Month".
Select Button 2
- In the Properties panel, Use Variable field, select the timefr variable and assign it a Klip scope.
- For Values sub-component, type: “Quarter”.
- For Labels sub-component, type: "Quarter".
To setup the Bar/Line chart to display a sum of values for each color type with a monthly or quarterly date range:
- Select the Bar/Line chart, X:Axis.
- Select the Properties panel and format as Text.
- Select the Data panel and use the SWITCH function to reference your timefr variable by typing $, and then build a specific formula for each date range selection (case).
For example,
For “Month”, the DATE_CONVERT function converts the current date format to display the data as year month.
For “Quarter”, the DATE_UNIT function uses the current date format to display the data as year quarter.
Lastly, select the X:Axis and use the three vertical dots to Group the dates and apply a Sort (A-Z).
- Select the Bar/Line chart, Series.
- Select the values column in your data source.
- Select the three vertical dots, Aggregation. The default is SUM, but you can change this here if you want.
To associate the color drop-down list to the Bar/Line chart:
- Select the Bar/Line chart component, Properties panel, and select Add Hidden Data button.This adds a new Data sub-component to the Bar/Line Chart.
- Select the Data panel, select the color column from the data source, and use the three vertical dots to set up a filter to add a condition that matches the color variable.
