# Dashboard Layout Object
# DashboardLayout
Top level object
# Properties
Name | Type | Description |
---|---|---|
type | string | Layout type. Currently, only columnar is supported |
columns | DashboardLayoutColumn[] | Array of columns |
# Example
{
type: "columnar",
columns: [
...
]
}
# DashboardLayoutColumn
Represents a column that may contain a sub-layout of rows and further columns/cells. Usually a Dashboard will contain 1-4 columns.
# Properties
Name | Type | Description |
---|---|---|
index | integer | Determines the order in which columns are displayed |
width | integer | Column width as percentage |
pxlWidth | integer | Column width as pixels |
cells | DashboardLayoutCell[] | Array of cells (rows) |
# Example
{
index: 0,
width: 50,
pxlWidth: 720,
cells: [
...
]
}
# DashboardLayoutCell
Represents a layout cell, which is seen as a horizontal row within a column.
# Properties
Name | Type | Description |
---|---|---|
subcells | DashboardLayoutSubcell[] | Array of sub-cells (individual widgets in a row) |
# Example
{
subcells: [
...
]
}
# DashboardLayoutSubcell
Represents an actual cell within a column and row, that contains a widget.
# Properties
Name | Type | Description |
---|---|---|
index | integer | Determines the order in which widgets are displayed within the row |
width | integer | Widget width as percentage |
pxlWidth | integer | Widget width as pixels |
elements | DashboardLayoutElement[] | Array of elements (widgets) |
# Example
{
index: 0,
width: 66.66666666666666,
pxlWidth: 785,
elements: [
...
]
}
# DashboardLayoutElement
Represents an actual cell within a column and row, that contains a widget.
# Properties
Name | Type | Description |
---|---|---|
widgetid | string | Widget ID |
height | integer | Widget/subcell height |
minHeight | integer | minHeight property taken from the Widget Manifest |
maxHeight | integer | maxHeight property taken from the Widget Manifest |
minWidth | integer | minWidth property taken from the Widget Manifest |
maxWidth | integer | maxWidth property taken from the Widget Manifest |
defaultWidth | integer | defaultWidth property taken from the Widget Manifest |
# Example
{
widgetid: "5f198c9ebf342a002d120e62",
height: 384,
minHeight: 96,
maxHeight: 2048,
minWidth: 128,
maxWidth: 2048,
defaultWidth: 512
}
# Full Example
Below you can find a full example of a Dashboard layout.
TIP
You can retrieve the layout of a Dashboard currently being viewed by opening the developer console and executing the following command: console.log(prism.activeDashboard.layout)
This example is a dashboard with 2 columns, the first containing 2 rows with a single widget each and a third widget is placed in the 2nd column.
{
"type": "columnar",
"columns": [
{
"width": 50,
"cells": [
{
"subcells": [
{
"elements": [
{
"minHeight": 96,
"maxHeight": 2048,
"minWidth": 128,
"maxWidth": 2048,
"height": 384,
"defaultWidth": 512,
"widgetid": "5f198c9ebf342a002d120e62"
}
],
"width": 100,
"stretchable": false,
"pxlWidth": 528,
"index": 0
}
]
},
{
"subcells": [
{
"elements": [
{
"minHeight": 96,
"maxHeight": 2048,
"minWidth": 128,
"maxWidth": 2048,
"defaultWidth": 512,
"widgetid": "5f198ca4bf342a002d120e66",
"height": 384
}
],
"width": 100,
"stretchable": false,
"pxlWidth": 1439,
"index": 0
}
]
}
],
"pxlWidth": 720,
"index": 0
},
{
"width": 50,
"pxlWidth": 719,
"index": 1,
"cells": [
{
"subcells": [
{
"elements": [
{
"minHeight": 96,
"maxHeight": 2048,
"minWidth": 128,
"maxWidth": 2048,
"defaultWidth": 512,
"widgetid": "5f198ca2bf342a002d120e64",
"height": "540px"
}
],
"width": 100,
"stretchable": false,
"pxlWidth": 720,
"index": 0
}
]
}
]
}
]
}