Components

Explo offers a number of components you can add onto your dashboards

We have introduced components to add more objects into your dashboard including text, date selectors, and dropdown menus.

  • Drag and drop these components onto your dashboard to use them.

  • To edit a component, double-click on the component and the editor will appear in the left side panel.

Components

Date selector

To configure a date selector:

  1. Label the component in the left panel.

  2. Select whether you want to enable time selection.

  3. Set a default date or relative date. This allows you to only show data from a certain timeframe relative to the current date.

  4. Use the variable created in your SQL query to determine where to filter for the date range

For in-between date ranges, you can use two separate Date selectors and the where statements such as below

WHERE 1=1 [[AND date > {{element1}}]]
[[AND date < {{element2}}]]
Date selector configured with query

For users connected to a BigQuery warehouse, you will need to cast the data variable to the correct data type using the code below.

--for casting to date type
WHERE 1=1 [[AND date_field >= DATE({{element1}})]]
[[AND date_field <= DATE({{element2}})]]
[[AND DATE(date_field) = DATE({{element3}}]]
‚Äč
--for casting to timestamp type
WHERE 1=1 [[AND date_time >= TIMESTAMP({{element1}})]]
[[AND date_time <= TIMESTAMP({{element2}})]]
[[AND TIMESTAMP(date_time) = TIMESTAMP({{element2}})]]

To configure a dropdown menu:

  1. Label the dropdown.

  2. Enter a placeholder for when no option is selected.

Manual

To manually configure a list of dropdown values, select the Manual option

  • Input the list of values that will be used to filter your data in square brackets. These values must match your data exactly.

  • [Optional] Input a list of display name values for your users to select. This can be the same as your values above or different. You much enter 1 Display name for each Value you enter.

  • [Optional] Input a default to select upon page-load. Input the value that you wish to select.

Query

To query for a list of dropdown options, select the Query option

  • Select a dataset that contains the dropdown options

  • Select which column the options are in

  • Select the Default dropdown to first value option if you wish to select the first option in the dropdown upon page-load

Use the DISTINCT statement in SQL to only pull a distinct list of options for the dropdown options

Using dropdowns to group by dates

In addition to using dropdown components to filter data, you can also set up dropdowns to allow users to group by different options.

To configure the dropdown to group by different date segments, select the Manual option and enter the values:

["day", "week", "month", "year"]

This dropdown element will then be used in the following dataset query:

SELECT DATE_TRUNC([[{{element1}}]], datefield::date) as date_part,
COUNT(*) as num_records
FROM master_data
GROUP By 1

Multi-select

Configure the multi-select component as you would a dropdown. In the SQL query, use the following syntax

WHERE 1=1
[[AND column_1 in {{element1}}]]

Text Component

This component allows you to add a block of text to your dashboard. Use this component for any labeling and providing additional information for your user.

The Text Component supports Markdown to give you the flexibility to configure the style and sizing of your text. You can reference the article here for Markdown.

Containers

Containers can be used to group other components together and organize your dashboard. Drag on a container and size it first, then drag new components into the container.