Dashboard Layers

Dashboard Layers#

Dashboard layers provide the means of splitting a dashboard into various subsections.

These subsections can then individually be shown or hidden thus enabling very complex interaction patterns.

Introduction#

image1

Squirro dashboards are split into layers, which in turn contain widgets. The default behaviour of a layer is simply that it enforces a new row for all the widgets inside.

It can be used to provide the basic layout of the dashboard, splitting it into various sections.

Layers can also be re-ordered by dragging them, thus enabling a quick way of changing the basic layout of a dashboard.

Where layers add significant value, however, is with conditions and auto-sizing: see below.

Conditions#

To enable the conditional display of a layer and all the widgets within, conditions can be enabled. The conditions can react to changes in the query or label selection, URL parameters passed to the dashboard, and programmatic changes through the dashboard store.

In a dashboard layer, click on the plus icon next to Visibility condition to open the visibility condition editor.

image2

In the Select field dropdown, select one of the condition options:

  • Query: matches based on the current dashboard query. The query changes every time the user makes a selection in the dashboard, so this can be used to react to user interactions.

    Examples:

    Condition

    Query contains test

    Shows the layer any time the user searches for “test” - whether through a bookmark, a selection or a search.

    Query is empty

    Shown when no query has been executed. This can, for example, be used to show a separate interface on the initial homepage screen such as a big search box.

    Query is not empty

    Shown when any query has been executed.

  • Dashboard Store: matches based on values in the dashboard store. The store can only be updated programmatically in custom widgets.

  • Label: matches based on a label being selected or having a specific value. This is usually used in combination with a label widget, such as a pie chart or table. The label name entered currently has to be the internal name of the label.

  • URL Parameter: used for embedded dashboards to react on parameters that are passed in. When using the Share or Embed iFrame options Squirro generates URLs of the form …/app/dashboard/Hwvd5ccARnqeb3oPmJoZOw/y7ROyPSlQd2_PNsxEh4wVg. To add URL parameters to this URL, append them after a question mark and separate them with an ampersand. For example: …/app/dashboard/Hwvd5ccARnqeb3oPmJoZOw/y7ROyPSlQd2_PNsxEh4wVg?welcome=1&system=intranet. This example adds two parameters: welcome which is set to 1 and system which is set to intranet. These can now be accessed, to show conditional information: image3

Autosize#

The option Autosize to fit frame expands the layer, so that the dashboard fills the entire browser window. This allows for fully response layouts, which is especially helpful when embedding dashboards.

The sizing of the layers is determined as follows:

  1. All the fixed layers (without autosize enabled) are put onto the screen.

  2. All the autosize layers are then distributed across the remaining window height. If there is one layer with autosize, it will use the rest of the screen height, if there are two such layers they each get 50% of the remaining screen height, etc.

Contents