{
"gridLayout": "Dashboard", // The layout name
"width": 1000, // This allows setting the initial width on the server side
"rowHeight": 150, // Rows have a static height, but you can change this based on breakpoints if you like. Defaults to 150
"autoSize": true, // If true, the container height swells and contracts to fit contents. Defaults to true
"verticalCompact": true, // If true, the layout will compact vertically. Defaults to true
"compactType": "vertical", // Compaction type. vertical | horizontal. Defaults to 'vertical'
"margin": [10, 10], // Margin between items [x, y] in px. Defaults to [10, 10]
"containerPadding": [0, 0], // Padding inside the container [x, y] in px. Defaults to [0, 0]
"isDraggable": false, // If true, all children inside the continer will be draggable. Defaults to false
"isResizable": false, // If true, all children inside the container will be resizable. Defaults to false
"useCSSTransforms": true, // Uses CSS3 translate() instead of position top/left. This makes about 6x faster paint performance. Defaults to true
"preventCollision": false, // If true, grid items won't change position when being dragged over. Defaults to false
"breakpoints": { "lg": 1200, "md": 996, "sm": 768, "xs": 480, "xxs": 0 }, // {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}. Breakpoint names are arbitrary but must match in the cols and layouts objects
"numOfCols": 12, // Number of columns in this layout. Defaults to 12
"withChartCanvasStyle": false, // If true, the grid layout container will apply the chart canvas css style
// The list of rows
"rows": [
{
"heading": "ADC Service", // The head title for this row
"icon": "adc", // The icon shows next to the heading
"numOfCols": 12, // Number of columns in this row. Defaults to inherit layout's numOfCols
"rowHeight": 100, // Rows have a static height, but you can change this based on breakpoints if you like. Defaults to inherit layout's rowHeight
"isDraggable": false, // If true, all children inside the continer will be draggable. Defaults to inherit layout's isDraggable
"isResizable": false, // If true, all children inside the container will be resizable. Defaults to inherit layout's isResizable
"className": "", // The additional css class for this widget
// The list of columns of this row
"cols": [
{
"widthUnits": 6, // The width unit of the grid units of the upon row, max grid unit is 12, defaults to 'auto'
"heightUnits": 1, // The height unit that the upon row takes, 1 means only existing in current row, 2 or more means occupying 2 or more rows, defaults to 1
"width": 200, // The static width of the chart, default unit is px
"height": 200, // The static height of the chart, default unit is px
"minWidth": 200, // The minimal static width of the chart, default unit is px
"minHeight": 200, // The minimal static height of the chart, default unit is px
"maxWidth": 200, // The maximal static width of the chart, default unit is px
"maxHeight": 200, // The maximal static height of the chart, default unit is px
"className": "", // The additional css class for this widget
"style": {}, // The css style for this column
"static": false, // If true, equal to `isDraggable: false, isResizable: false`
"isDraggable": true, // If false, will not be draggable. Overrides `static`. Defaults to inherit its row's isDraggable
"isResizable": true, // If false, will not be resizable. Overrides `static`. Defaults to inherit its row's isResizable
"viz": [
// The list of visualizations (basic common config)
{
"vizName": "mainChart", // The name of the visualization
"vizType": ["line", "bar", "table", "pie", "map"], // The type of the visualization
"dataSourceID": "ROT.ADC.ThunderDashboardSLBLoadDistribution", // The data source ID to provide data to the visualization
"description": "" // This text will show up on hover
}
]
}
],
"viz": [] // The list of visualizations. This equals to wrap by one column: cols: [{ viz: [...] }]
}
]
}