Explo
Search…
Date Range Picker
Date range pickers allows your customers to filter the dashboard by a date range.

What it does

This component allows you to create a date range picker input that your users can use to filter data.
When the element is added to the dashboard, it looks like:

Configuration

Date range picker configuration

Basic Configuration

Configuration Option
Description
Label
This text is the label given to the dropdown select on the dashboard. The label is placed above the dropdown. This field can be empty.
Default Range
This allows you to set the selected range that the component will default to
Enable user dropdown
(Default: False) This enables the date range element to have a dropdown attached to it that allows your users to select pre-defined ranges rather than needing to use the date picker to select the range.
Enable clearing selection
Allows end-users to clear the date range and select all dates
Set end date to end of day
Set the end date in include all data through the end of the day. Disabling will select data through the current time on that specific end date.

Variable Usage

In the SQL dataset

To access the elements in the SQL editor, use the following syntax:
1
--to reference the first date
2
{{date_range_picker.startDate}}
3
4
--to reference the second date
5
{{date_range_picker.endDate}}
6
7
8
--example
9
WHERE 1=1
10
[[AND date_field >= {{date_range_picker.startDate}}]]
11
[[AND date_field <= {{date_range_picker.endDate}}]]
Copied!

In the panel configuration

You can also link the data range picker directly to a specific chart or table by configuring the filter section in the component edit mode without writing any SQL
  1. 1.
    Select the component you wish to filter
  2. 2.
    Drag a time or date field into the filter section
  3. 3.
    Select the operator "is between", the variable option, and the correct date range picker