Bosch IoT Insights

Arranging widgets in the grid-based layout

With the grid-based layout, you can easily change the size and the position of widgets on your dashboards.

Prerequisites

  • You have added a dashboard with the grid-based layout as described in Dashboards.

  • You are assigned to the Power User role or higher.

Editing widgets

Proceed as follows

Click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget you want to edit and select Edit Widget.

→ The configuration page of the widget is displayed.

Also refer to the Editing a widget chapter.

Rearranging widgets

Proceed as follows

  1. Click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png next to the dashboard name and from the menu that opens, select Rearrange.

    images/confluence/download/thumbnails/2858691592/dashboard_header_bar_menu-version-1-modificationdate-1734421473000-api-v2.png


    Alternatively, click the options icon of any widget and then select the Rearrange option.

  2. On the header bar, use the Zoom out and Zoom in icons, if you need to see an overview of the entire dashboard and then navigate more easily to the relevant widget(s).

    images/confluence/download/attachments/2858691592/rearrange_options-version-3-modificationdate-1752500383000-api-v2.png
  3. Drag and drop the widgets to the desired location. You can also drag and drop a widget (including a Tab widget) directly into a tab of a Tab widget.

    When you are dragging a widget, a shade shows you where you the widget's location will be automatically adjusted.

    images/confluence/download/attachments/2858691592/dashboard_widgets_grid_layout-version-1-modificationdate-1752500384000-api-v2.png

  4. To resize a widget, click any of its borders and drag it to the desired size.
    → The widget is resized as desired and automatically adjusted as shown by the shade.

    images/confluence/download/attachments/2858691592/resizing_widgets-version-1-modificationdate-1752500384000-api-v2.png


    Widgets have a minimum and maximum size to avoid scrolling and white space.

    For widgets with dynamic data, e.g. the Table widget, the size of the widget is automatically adjusted to display all rows without the need to scroll.

  5. To undo and respectively redo a rearrangement, use the Undo and Redo icons on the header bar. You can repeat these actions as many times as needed.

    These icons become active only after you have moved a widget on the dashboard.

  6. To decrease and increase the number of columns on the dashboard grid, use the respective icons on the header bar, namely Decrease columns images/confluence/download/thumbnails/2858691592/table-row-delete-version-1-modificationdate-1752500384000-api-v2.png and Add column images/confluence/download/thumbnails/2858691592/table-row-add-above-version-1-modificationdate-1752500384000-api-v2.png .

    The grid is not displayed but is still applied in the background.

    Such an action will not affect the tabs within a Tab widget on the dashboard. If you need to configure the number of grid columns for each tab of a Tab widget, enter the Tab widget's configuration editor and follow the steps described in Tab widget.

  7. To save your changes, click the Save icon images/confluence/download/thumbnails/2858691592/save_icon-version-2-modificationdate-1752500384000-api-v2.png on the header bar.

    images/confluence/download/attachments/2858691592/rearrange_options-version-3-modificationdate-1752500383000-api-v2.png

  8. To discard your changes, click the Discard layout changes images/confluence/download/thumbnails/2858691592/close-version-1-modificationdate-1752500384000-api-v2.png icon on the header bar.

General functions

Maximizing/Minimizing widgets

Proceed as follows

  1. To maximize the widget, click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget and select images/confluence/download/thumbnails/2858691592/fullscreen-version-1-modificationdate-1752500384000-api-v2.png Maximize/Minimize.
    → The widget is enlarged.

  2. To minimize the widget, click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget and select images/confluence/download/thumbnails/2858691592/fullscreen-exit-version-1-modificationdate-1752500384000-api-v2.png Maximize/Minimize.
    → The widget is restored to its regular size.

Refreshing a diagram

Proceed as follows

Click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget you want to refresh and select Refresh Diagram.

→ The data in the widget is refreshed.

Downloading the JSON

Proceed as follows

  1. Click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget you want to download the JSON from and select Download JSON.

  2. Open or save the file to the desired location.
    → The widget data has been downloaded.

Downloading the CSV

Proceed as follows

  1. Click the options icon images/confluence/download/thumbnails/2858691592/icon_options-version-1-modificationdate-1679390639000-api-v2.png in the widget you want to download the CSV from and select Download CSV.

  2. Open or save the file to the desired location.
    → The widget data has been downloaded.