Interactive Filters

Filters refine data based on selected criteria. You can choose specific fields or values to view only the relevant information. To start working with filters, familiarize yourself with the various filter components used to create and interact with filters inside the Qrvey platform.

Filter Modals

The filter modal is the central component for defining filters. It allows you to set the scope, column, conditions, and values for filtering your data.

The following image shows the initial state of the filter modal when opened. All data columns of the selected dataset are displayed in the center area and can be searched using the search box. The filter’s scope can be defined using the dropdown list in the bottom-left corner.

Once a column is selected, the center part of the modal changes to allow you to define your desired criteria.

1. Selected column to filter - Change your selection by clicking the arrow on the right side to open the dropdown list of columns.
2. Operand for filtering - The default operand may vary depending on the selected column’s data type. A complete list of operands is available via the dropdown. The selected operand determines the layout of the next section.
3. Select All and Searchbox - Use the search box next to the Select All checkbox to search for specific values or add new ones. If Select All is checked, all values are selected, and new values cannot be added.
4. Available values for the selected column - For text columns with the EQUAL operand, a list of values is displayed. Scrolling through a long list loads more data.
5. Selected or excluded values - This section varies depending on the operand and the column’s data type.

When Select All is checked and the dataset is updated, new values are automatically added to the filter. For example, if you create a filter using the Countries column and check Select All, new values added to the Countries column will automatically be included in the filter.

If you uncheck some values, these unchecked values will appear in the filter modal as All Except: (value). In this case, new values will not be automatically included when the dataset is updated.

Once you define your filter criteria, the Apply button at the bottom of the window is enabled. Clicking Apply creates a new filter, refining your data based on the selected criteria.

Tokens in Filters

Tokens provide additional flexibility by allowing dynamic values in filters. Typing {{ in any input box inside the filter dialog displays system tokens and aggregates of data columns. For example, you can create a filter to find records where the customer’s creditLimit is less than the average value of the creditLimit column.

Filter Panels

The filter panel on the right side of the screen displays and manages all filters applied to visuals in your workspace. This panel is also available in the Dashboard, Pixel Perfect Report Builder, and various views within Datasets > Analyze.

Panel Options

1. Add Filter - Opens the filter modal to define filters.
2. Filter panel settings - Customizes the following:
   • Show panel in page view - Toggles the visibility of the filter panel in the end-user view.
   • Panel default view - Sets whether the filter panel is open or closed by default in the end-user view.
   • Scope - Configures the panel’s appearance, including scope icons or colors.
3. Options - Disables or deletes all filters via the three-dot menu.
4. Collapse/Expand - Collapses or expands the filter panel.

Filters are grouped by scope. You can edit, disable, or delete filters within a scope using the three-dot menu. The filter panel dynamically displays only the filters relevant to the selected component.

Filter Controls

Filter Controls are filters that can be placed anywhere on a Dashboard and used to filter any Chart that uses the data column being filtered. Just like the filter modal, the filter components list formulas in the column selection dropdown as well.

In Qrvey, we provide a set of filter controls that you can drag and drop to the canvas inside the Dashboard to make them available to end-users when the page is published or embedded.

Date Picker

The date picker acts as a calendar and can filter multiple columns across datasets. For example, it can filter both hire date and shipped date with one control.

Common Settings

• Column: The dataset column(s) used for filtering.
• Label: Placeholder text shown when no value is selected.
• Operator: Default logic operator (e.g., EQUAL).

More Settings

• Hint: Customizes the dropdown hint text.
• Trigger: Sets filtering to start automatically or via a button.
  • Button Text: Sets the button text.

Style Settings

• Selectors / Checkboxes: Default color of the icon.
• Button Background: Default color of the background.
• Button Border: Default color of the button border.
• Button Text: Default color of button text.
• Background: Default color of the background.
• Border: Default color of the border.
• Font Type: Default font type.
• Font Color: The default label and the selected values will have this color.

Multi-Select List

The Multi-Select List allows you to apply the same filter to one or more columns, from any dataset used in the Dashboard.

Common Settings

• Column: The dataset column that will be used to filter the data. End Users will not be able to change this setting so every time they select a value, charts will be refined by the dataset’s column defined by the creator.
• Label: The filter component's label.
• Operator: Selectable filter operators (e.g., EQUALS, DOES NOT EQUAL).
• Default Operator: Sets the default operator.

Source Data

• Dataset: Specifies the dataset for display and value columns.
• Display Column: Column values displayed in the filter.
• Value Column: Column values used for filtering.

More Settings

• Hint: Customize the text string "hint" that appears in the dropdown menu.
• Type: Show as dropdown or list.
• Trigger: Choose how filtering begins: Automatic or clicking on the "Filter" Button.
  • Button Text: Sets text within the button.
• Cascade Filter: Toggle whether this is a Cascade filter.
  • React to Cascading Column: Defines which filter and what data column will initiate the cascading.

Style Settings

• Selectors / Checkboxes: Default color of the icon.
• Button Background: Default color of the background.
• Button Border: Default color of the button border.
• Button Text: Default color of button text.
• Background: Default color of the background.
• Border: Default color of the border.
• Font Type: Default font type.
• Font Color: The default label and the selected values will have this color.

Multi-Select List filters can be chained together to create a cascading effect. This feature is used when hierarchical groups are present and you wish for your selection of one filter value to limit the available choices in the next. One example is when States and Counties are listed in two filters and they are linked so that choosing a state from the first filters the second to the counties of the selected state. In order to create the cascading behavior, follow these steps:

1. Add at least two Multi-select filters to a dashboard page and set those up based on two columns of the same dataset.
   Make sure that there is a logical hierarchy between the two selected columns. For example Country > State, School > Students, or similar. In the example below the first filter is set on a list of product vendors and the second list is of the product lines supplied by those vendors. Both lists are tied to the Products dataset.
2. In the configuration panel for the second filter, check the Cascade filter checkbox. This indicates that the values presented in this list will be filtered as soon as the user picks one or more values from another filter.
3. Define which filter and what data column will initiate the cascading by selecting the desired data column from the React to cascading column list. The dropdown automatically offers a list of columns that belong to the same dataset and have been set as the selected column in another Value List filter on the page. You will be prompted if such a filter/column cannot be found.
4. Publish the page or go to Preview Mode to test the filters in action.
   Remember: free-standing filters don’t work in Design Mode and can only be interacted with when in Preview or Interaction mode.

Input Box

Input Box allows users to enter a free form text and search for it in any of the selected columns. To add an Input Box control select it from the list of filter controls located in the toolbar and drop it anywhere on the page and size it appropriately. The control consists of a label, an input text box, a drop-down list of operators, and a button to apply the changes and start the search.

Common Settings

• Column: Columns to search (must be of the same data type).
• Label: The filter component's label.
• Operator: Selectable filter operators (e.g., EQUALS, LESS THAN).

More Settings

• Hint: Customizes the dropdown hint text.
• Trigger: Sets filtering to start automatically or via a button.
  • Button Text: Sets the button text.

Style Settings

• Selectors / Checkboxes: Default color of the icon.
• Button Background: Default color of the background.
• Button Border: Default color of the button border.
• Button Text: Default color of button text.
• Background: Default color of the background.
• Border: Default color of the border.
• Font Type: Default font type.
• Font Color: The default label and the selected values will have this color.

Selecting the Input Box component will enable the configuration panel where you can configure the default settings.

Deciding What To Filter

Depending on your analysis needs, you can decide what to use as the subject for filtering: the underlying data or the aggregated data. For example, are you looking for the sales numbers for all products priced under $100, or are you interested in states where your total sales exceeded $50,000? This section describes how to achieve each of these goals.

Filters On Dataset Columns

The default way of filtering is by the raw value of a dataset column. This method is employed when you choose one of the columns of the dataset from the filter modal.

Filters On Aggregates

To set the filter on the aggregate value of the data, you need to create a chart that uses one or more aggregated pieces of data. As long as such aggregates exist, they appear in the filter modal, alongside the other columns, and can be selected to be filtered.

You can identify an aggregated column on the filter’s modal by its column name with an aggregation operation in parentheses. In the following example, the count aggregate of the column “Branch” has been selected to be filtered on.

Filtering Based On Relative Dates

Qrvey offers a powerful feature for filtering date-type columns that allows you to create the filter based on a variable date, relative to an anchor date. For instance, if today’s date is 2/8/2021 and you wish to see the data for the last ten months, instead of selecting the fixed date of 4/9/2020 you can simply select “last 10 months from today”. To initiate a relative date filter select a date type column from your filter modal and select the “In” operator from the list of operators.

You can pick your needed unit (Hour, Day, Week, Month, Quarter, Year) and the direction (This, Next, Last). The other controls on the dialog may be removed or disabled based on these selections. Filters based on hours are only enabled if the date field contains time data.

Calendar Versus Rolling Date Ranges

If The Last or The Next is selected as the direction of the date filter, and the unit is set to anything but Hour or Day, the Calendar dates checkbox is enabled and defaults to checked, which takes a calendar-based approach to calculating filter date ranges.

A calendar-based approach calculates the date ranges, taking into account the start and end date of a calendar's period (week, month, year, etc.). For example, if today’s date is any day in 2021, “the last 2 years” will be calculated as “the last 2 calendar years”, aka 1/1/2020 through 12/31/2021 (assuming that the Include starting date checkbox and Starting From anchor are left at their default checked and Current Date values).

If Calendar dates checkbox is unchecked and the other controls stay at their same setting, the date range calculation will be “rolling”. That means that the last two years will be calculated relative to the anchor date and automatically shifts forward without considering calendar periods. So if today’s date is 2/8/2021 the filter range will be 2/8/2019 through 2/8/2021 today and change to 2/9/2019 through 2/9/2021 tomorrow, and so on.

Inclusive Versus Exclusive Date Ranges

If The Last or The Next is selected as the direction of the date filter, and the unit is set to anything but Hour or Day, the Include starting date checkbox is enabled and defaults to checked. This setting includes the selected date of the anchor in calculating the date range. For example, if today’s date is any day in 2021, “the last 2 years” will include 2021, resulting in 1/1/2020 through 12/31/2021. However, if the checkbox is unchecked - making the date range exclusive of the anchor date - the last 2 years will result in 1/1/2019 through 12/31/2020.

Note: The Dates Selected label always shows the calculated date range based on the selected values for the controls.

“Dates” Versus “Date Names”

Sometimes there may be a need to filter based on “date names” and not dates. An example of this is when you want to find all data for the “month of January” and not “January 2020”. Or “Q3” in general, as opposed to “Q3 2021”. This can be accomplished by choosing “Quarter of Year”, “Month of Year”, etc. options in the date filter, as opposed to Quarter, Month, etc. This feature is available for date filters when using the Equals operator.

See/Edit Filters Directly from Charts

When any filter or filters (other than hidden security filters) apply to a chart, the filter icon on the chart panel is highlighted with a dot, indicating that the chart data has been filtered. In that case, Creators and End Users can see these filters in a small popup, by hovering on the chart’s filter icon.

Adding a New Filter

You can add a filter by clicking the Add Filter button in the side panel or you can add it directly from the chart.

To add a new filter, hover on the filter icon and click the Add Filter link.

All filters added to the panel will appear in the filter panel and the filter list in the charts.

Filters added from the popup will have the Panel scope.

Editing / Deleting a Filter

Filters can be edited or deleted directly from the popup. Go to the three-dot menu and click the Edit or Delete option.