Dashboard Items Layout

• Jun 02, 2020
• 2 minutes to read

The Web Dashboard allows you to arrange and resize dashboard items and groups using drag-and-drop operations.

• Layout Concepts
• Item Resizing
• Maximize and Restore Item
• Item Positioning

Layout Concepts

The dashboard arranges dashboard items and groups using layout items and layout groups. They are containers that display a dashboard layout as a hierarchical structure.

Refer to Dashboard Layout to learn more about concepts related to a dashboard layout.

Item Resizing

You can resize individual items/item groups by dragging their edges.

1. Hover a mouse to the area where the cursor changes to Horizontal Resize (the pointer) or Vertical Resize (the pointer).

   

2. Left-click and drag the cursor to resize the items.

   

Maximize and Restore Item

You can expand any dashboard item to fit the dashboard to examine data in greater detail. The expanded dashboard item size in this case is the same as the root layout group.

1. Click the Maximize button in the dashboard item caption to maximize a dashboard item.

   

2. Click Restore to restore the item’s size.

   

In code, call the following methods:

maximizeDashboardItem(itemName)	Expands the specified dashboard item to the entire dashboard size to examine data in greater detail.
restoreDashboardItem	Restores the item size if an item is expanded to the entire dashboard size (maximized).

Note

The dashboard item is re-created when you maximize / restore the item. All events connected with dashboard item life cycle (such as ItemWidgetCreated, ItemWidgetUpdated, etc.) are fired again.

Item Positioning

You can change the dashboard item’s position by using drag-and-drop and the dashboard item’s Move button.

The dashboard arranges dashboard items and groups using layout items and layout groups. They are containers that display a dashboard layout as a hierarchical structure. The dashboard item can be inserted into a new or existing dashboard layout group.

The following steps illustrate how a dashboard item is dragged.

1. Click a dashboard item to select it and hover over the Move button. The cursor is changed to Move (the pointer).

   

2. Drag the dashboard item to the expected area and release the left mouse button when the drop indicator displays the required area.

   

3. The dashboard item is moved to a new position.