Filter Widgets give report viewers controls on the page itself for narrowing down the data, so they don't need to open the Filters panel. Each selection shows as a read-only card in the Filters Panel, as described in Filter Widget Cards.
Button Filter shows clickable toggle buttons for quick single or multi-value filtering. Use it when the list of values is short enough to display as buttons.
List Filter shows a scrollable list for selecting one or more values from many options. Use it when there are too many values to show as buttons.
Date Filter shows date boxes, with a slider for the range types, for filtering by date range or specific dates.
The example below shows all three Filter Widgets alongside a KPI Widget showing total revenue from a year of orders. The Button Filter lists the four sales regions, the List Filter lists the products and the Date Filter covers the order dates. Selecting a value in any Filter updates the KPI, because the KPI reflects the combined selection of all of them.
Setup Copy Link
Each Filter Widget takes one field, and filters the report by it.
| Widget | Slot | Required | Accepts | What it does |
|---|---|---|---|---|
| Button Filter, List Filter | Value | Yes | One category | Shows one button or list item for each value of the field. |
| Date Filter | Value | Yes | One date field | Filters by the dates chosen in the date boxes or on the slider. |
Format Copy Link
Filter Widgets have these settings of their own on the Format tab, beside the title and appearance settings every Widget has. Your developer can change the defaults shown.
| Setting | Where | Default | What it does |
|---|---|---|---|
| Selection Type | Button Filter or List Filter section | Multiple | Lets viewers select several values, or one at a time. See Selection Type. |
| Alignment | Button Filter section | Center | Aligns the text in each button. |
| Border | Button Filter section | On | Draws a border around each button. Width, Corner Radius and Color change the border. |
| Active Style | Button Filter section | Theme colours | Sets the text, background and border colours of a selected button. |
| Dimensions | Button Filter section | Min Width 100, Height 50 | Sets the narrowest width and the height of each button, in pixels. Buttons widen to fill each row. |
| Filter Type | Date Filter section | Between | Chooses how dates are picked. See Date Filter Types. |
The Button Filter and List Filter sections also set the font and colour of each item.
The example below shows a selection of Button Filter settings, each changed in its own Widget, beside a Button Filter with its defaults.
Selection Type Copy Link
With Multiple, viewers can select as many values as they like. With Single, selecting a value replaces the one selected before. In a List Filter, each value has a checkbox beside it for Multiple, or a radio button for Single. Under Single, the first item, Select All, clears the filter.
The example below shows a List Filter of products with each Selection Type.
Date Filter Types Copy Link
The Filter Type sets how a Date Filter chooses its dates:
- Between keeps the dates from a start date to an end date.
- On keeps one date.
- On or After and On or Before keep the dates from, or up to, one date.
- Relative keeps a period counted from today, such as the last 30 days or this month.
For the Between, On or After and On or Before filter types, a slider below the date boxes runs from the field's earliest date to its latest. Drag a handle to choose a date. The date box updates as you drag, and the filter applies when you let go. To clear a date, drag the start handle to the far left or the end handle to the far right. You can also move a focused handle with the arrow keys, Page Up and Page Down, and Home and End.
The example below shows a Date Filter of order dates with each Filter Type.