Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Dashboard Editor is a tool offered by Squirro which allows you to build meaningful dashboards by adding widgets and configuring them. The tool also exposes the conditional layers in the user interface where a layer is made visible when it satisfies a certain visibility condition.

Table of Contents

Table of Contents
outlinetrue
excludeTable of Contents

Creating dashboards

To create a dashboard, 

  1. Navigate to the visualise tab under the 'Setup' space.
  2. Click on the round + button at the top right of the dashboards list page.
  3. Alternatively, you can use the 'More' button's dropdown to create a dashboard from the current search query.



  4. Directly after creation, you are presented with a fresh dashboard where some widgets are put together to give you a head start, along with a link to the documentation to the widgets.

  5. Continue with the next sections to learn how to configure the newly created dashboard.

Dashboard Editing Interface

  • On creating a new dashboard, you automatically land on the edit mode of the dashboard.
  • The navigation bar shows you the Project name and the dashboard name. 
  • In the center of the nav bar are toggle buttons which allows you to switch between the desktop and the mobile version of the dashboard. More about the mobile dashboard editor here.
  • On the right of the nav bar, there is a switcher button which allows you to switch between the edit and the view mode of the dashboard. Clicking on 'Exit' button exists the editor and takes you back to the list of dashboards.
  • The dashboard editor consists of two panels, the tree panel on the left and the properties panel on the right.
  • The tree panel lists the entities like dashboard, layers and widgets while the properties panel displays the config. options to configure the entity selected from the tree panel.
  • The properties panel has a  L | R button which allows you to switch the positioning of the properties panel to the left or the right of the screen. The system also remembers your preference for the panel positioning.
  • At the bottom of the tree panel are the buttons to add a new layer or a new widget to the dashboard.

Dashboard Properties

  • Click on the dashboard in the tree panel to edit its properties.
  • Enter the title, query, time range, or dashboard loader as desired.
  • Position the reset button as desired. 
  • Showing filtering panel replicates the explore page experience where you have all your filters like facets, smartfilters, trends and favorites listed together.
  • Once done, press the SAVE button at the top to save your changes.

Layer Properties

  • Click on a layer in the tree panel to edit that layer's properties.
  • Rename the layer title.
  • Add visibility condition to the layer by clicking on the + button. This will open a modal where the visibility rules can be defined.
  • Once the visibility conditions are saved, the layer config. displays a green tick.
  • 'Autosize to fit frame' resizes all widgets on a layer proportionately on resizing the browser window. 
  • 'Free widget placement' ignores the fixed spacing between the widgets and allows you to arrange the widgets in any desired layout.

Widget Properties

  • Click on a widget in the tree panel to edit that widget's properties.
  • Alternatively, you can also hover over a widget and click on the edit icon displayed inside a button pill
    Image Added
  • All widget properties are divided into three sections:
  • The topmost general section where the widget type and the widget title can be configured.
  • The DATA section which lists all data configuration related options like facet, no. of values, additional widget query, etc. are listed together.
  • The VISUALISATION section where all chart options and other visualisation related config. options are listed together.
  • Besides, there is an additional section called DEVELOPER OPTIONS which exposes general API related config. options in the UI.

Widgets

Widgets are the building blocks of a dashboard. Each widget represents data in a particular form. Currently, Squirro offers a number of built-in widgets, such as pie charts, time frequency graphs (line charts) and word clouds.

Widget types

The available widget types are listed on the page Widgets.

Add widget

To add a widget,

  1. Enter edit mode on the dashboard,
  2. In the edit pane on the right, press the plus button next to the "Widgets" header.



  3. Set a title and the widget type to use in this form.



    See the Widgets documentation for information about the various widget types.

  4. Depending on the widget type, additional configuration options may be displayed and required.
  5. Changes made in this form are applied immediately to the dashboard, but not yet saved.
  6. To save the changes, use the Save Dashboard button at the top of the edit sidebar.

Moving widgets

To move a widget,

  1. Enter editing mode as described above,
  2. Click on the handle in the middle of the top frame of the widget,
  3. Drag widget using the handle.

Editing widgets

To edit a widget,

  1. Enter editing mode as described above,
  2. Click on the pencil icon in the right upper corner of the widget's frame,


     
  3. The widget is activated in the edit panel on the right side of the screen.



  4. Changes made in this form are applied immediately to the dashboard, but not yet saved.
  5. To save the changes, use the Save Dashboard button at the top of the edit sidebar.

Deleting widgets

To delete a widget,

  1. Enter editing mode as described above,
  2. Click on the delete icon in the right upper corner of the widget's frame,



  3. Confirm the deletion in the resulting dialog.

Facet Value Formatting

It is possible to format the values of numerical and date facets to be displayed in the dashboard widgets. 

To do so, one can define the facet formatting screen in the Facets management section of Squirro.


Formatting of numerical facets (of type int or float)

The string defined in 'Format' section will be used to display the facet values in Dashboarding. Any string can be used to that purpose, and a preview of the formatting is visible to the right of the format input field.

To inject the actual facet value into the resulting string, %d placeholder is used.


Formatting String
Result for a facet value of 123456.789
%dEUR123456.789EUR
$%d$123456.789



Additional formatting options are available for the %d placeholder, allowing to define the separator between each magnitude of 1000, as well as the symbol used to the floating point, in the case of values of float datatype.


Formatting String
Result for a facet value of 123456.789
%'dEUR123'456.789EUR
%.,dEUR123.456,789EUR
%',dEUR123'456,789EUR



It is also possible to specify the rounding precision of floating point values, after the floating point.


Formatting String
Result for a facet value of 123456.789
%2dEUR123456.79EUR
%,1dEUR123456,8EUR
%',0dEUR123'457EUR



Formatting of facets of type Date

 

To format facet values containing dates (and times), Squirro offers three formatting options, defined in the Facets configuration screen.

Each option is accompanied with a preview of the resulting formatted value.

Embedding and Sharing Dashboards

To share or embed the current dashboard,

  1. Click the Dashboard Setting Button and select "Share Dashboard" or "Embed iFrame"



    The Embed iFrame offers an iframe HTML tag, which can be used for embedding the dashboard in a 3rd-party web site or application. The Share Dashboard option offers a URL, which can be easily shared via email or other means.

Dashboard URL API Reference

The URL which is generated by the Embed and Share options in the dashboard can be extended with additional options. The following URL parameters can be used to change the behavior of the dashboard.


Parameter
Description
Example Value
queryOverride the Dashboards search query as documented here.&query=(blue OR green OR red)
selectionSet the Foreground query for all Significant Terms widgets&selection=blue
created_beforeOnly display results with a created_at value lower than this

&created_before=2014-12-31
&created_before=2014-12-31T18:30:00

created_afterOnly display results with a created_at value higher than this&created_after=2012-12-31
&created_after=2012-12-31T18:30:00
relative_startOnly display results with a created_at value higher than this, in relative terms to today

&relative_start=2y
&relative_start=8w

relative_endOnly display results with a created_at value lower than this, in relative terms to today&relative_end=1y
&relative_end=4w