Dashboard Layout
The dashboard layout tab allows you to organize dashboard elements and launch the Node-RED dashboard for review.
From the Layout tab, you can add tabs and links, as well as launch the Node-RED Dashboard where you can review your dashboard.
Use the Dashboard nodes on the Node Palette to add to your layout.
The Dashboard offers easy drag-and-drop dashboard construction. The following table shows the elements used to create a dashboard.
Dashboard Element | Description |
|---|---|
Tab | A dashboard can have multiple tabs, which enable navigation to different pages. |
Group | Use a group as a building block to organize display nodes on a page. In a web UI context, this grouping is often referred to as a portlet. |
Nodes | Drag Dashboard Nodes onto the Canvas and designate the tab and group to which the nodes belong. |
An example of basic flow dashboard elements is shown below.
Caution: The + tab, + link, + group, and edit tabs in the dashboard layout view are visible only when you mouse over the tab / group row.
Navigate to the Dashboard Layout tab in order to configure various layout settings related to the Node-RED dashboard layout.
To navigate to the Dashboard Layout tab:
- Log in to Litmus Edge.
- From the Navigation panel, select Flows Manager. The Overview pane appears.
- Click the Expand icon next to a selected Flow. The selected Flow view opens in a separate browser tab.
- Click the Menu icon, select View > Dashboard, and then drag the Sidebar up from the bottom of the canvas. The Layout tab appears by default.
You can add a dashboard tab from the Dashboard Layout tab.
To add a dashboard tab:
- Navigate to the Dashboard Layout tab.
Click + tab. A new tab appears in the Tabs & Links box.
- Click Deploy. The Layout is saved.
You can rename a dashboard tab from the Dashboard Layout tab.
To rename a dashboard tab:
- Navigate to the Dashboard Layout tab.
Hover over a selected tab and click Edit. The Edit dashboard tab node pane appears.
Edit dashboard tab node pane- Enter a new name in the Name field, and then click Update.
- Click Deploy.
You can modify a dashboard tab icon from the Dashboard Layout tab.
Tab icons can be modified by selecting alternate icons from these sources:
- Material Design Icons
- Font Awesome Icons
- Weather icon
To modify a dashboard tab icon:
- Navigate to the Dashboard Layout tab.
- Hover over a selected tab and click Edit. The Edit dashboard tab node pane appears.
- Enter the name of the icon in the Icon field, and then click Update. For example, check_circle, or home.
- Click Deploy.
Tip: The Icon field can be a Material Design icon (e.g. 'check', 'close') or a Font Awesome icon (e.g. 'fa-fire'), or a Weather icon (e.g. 'wi-wu-sunny').
You can use the full set of google material icons if you add 'mi-' to the icon name. e.g. 'mi-videogame_asset'.
You can remove a dashboard tab from the Dashboard Layout tab.
To remove a dashboard tab:
- Navigate to the Dashboard Layout tab.
Hover over a selected tab and click Edit. The Edit dashboard tab node pane appears.
- Click Delete.
- Click Deploy.
You can add a group to a dashboard tab from the Dashboard Layout tab.
To add a group to a dashboard tab:
- Navigate to the Dashboard Layout tab.
Hover over a selected tab and click + Group.
Hover over the tab to view these options.- Click Deploy.
You can add a dashboard group from the Dashboard Layout tab.
To modify a dashboard group:
- Navigate to the Dashboard Layout tab.
- Hover over a selected group and click Edit.
Hover over a selected group and click Edit. The Edit dashboard group node pane appears.
Edit dashboard group node- Modify the group name, tab, class or width and then click Update.
- Click Deploy.
You can remove a dashboard group from the Dashboard Layout tab.
To remove a dashboard group:
- Navigate to the Dashboard Layout tab.
- Hover over a selected group and click Edit. The Edit dashboard group node pane appears.
- Click Delete.
- Click Deploy.
