Dashboards are powerful tools for visualizing and managing your operations. By allowing you to organize them into tabs, the Layers feature brings your dashboards to the next level. Each layer acts as a doorway into other dashboards, enabling seamless navigation between key operational areas. Soon, Layers will also support custom or third-party pages, giving you even more flexibility to tailor your workspace.
By centralizing multiple dashboards in one, Layers simplify navigation, saving you time and improving efficiency. Whether you're monitoring performance metrics, analyzing trends, or controlling devices, Layers make it simple to keep everything within reach.
Requirements
An active Ubidots account.
1. How Do Layers Work in a Dashboard?
Layers can be thought of as the tabs of a web browser, where one of your dashboards serves as the browser and each layer you create within it is a tab that contains other dashboards. In the near future, you will also be able to create layers with custom or third-party pages.
Once your layers are created, you can navigate through them from the same dashboard by clicking on any tab, unlike the traditional navigation, which requires you to visit isolated dashboards one at a time.
2. Creating Dashboard Layers
To create layers in a dashboard, follow these steps:
Go to any dashboard or create a new one.
Once in the dashboard, click on the pencil icon located at the upper left corner of the dashboard.
Once in the layers menu, you can add new ones by using the “+ add layer” button.
You can also duplicate existing layers by clicking on its header.
With the “default layer” drop-down menu, define the layer to be displayed when you first enter the dashboard.
Layers in dynamic dashboards can be configured using this options:
Default time range: data within the selected time range will be displayed in the layer by default.
Device list: select the set of devices that will be linked to the dashboard and that will appear on the dropdown list of the navbar.
Width: define the width of the layer with the different options in the drop-down menu. This is especially useful for layers that will be displayed in particular screens such as TVs or tablets.
Alignment: determine the orientation of the layer’s contents.
Use the options at the layer’s header to:
Change the order of the layers by dragging and dropping them in the desired position.
Go to that layer in a new browser window.
Delete the layer.
Duplicate the layer.
Hide/show the layer.
Edit the configuration of the layer.
Hide/show the layer’s configuration options.
2.1. Styling layer tabs
To change the style of your layer tabs, simply follow these steps:
Go to the dashboard whose layers you want to style.
Go to its settings by clicking on the edit button (the pencil) at the far right of the dashboard’s options bar.
Go to the “appearance” tab and click on the “custom style” option.
Once the style editor opens up, scroll down until you see the
layersBarsection.There, you can modify these five properties:
Background color (
backgroundColor).Font color of the selected tab (
selectedTextColor).Font color (
color)Font size (
fontSize)Border radius of the bar (
borderRadius)
Once you’re done, just click on the “save” button.
3. Sharing Layers
You can externally share individual layers or the whole dashboard (all the layers) following these steps:
Head over to the dashboard's drawer.
Click on the options button (three dots) of the dashboard that contains the layer you want to share.
Click on the "share" button.
Select the layer you want to share on click on "all layers" to share the whole dashboard.
Configure the remaining share options and click on the "done" button.
Notes:
|