Dashboard Customization
The Customization Object
Every widget defines its own structure and allows this structure to be configured with a customization object. This enables fine-grained control over the visibility and behavior of UI components in the Dashboard widget. It allows teams to tailor the interface based on user roles, product branding, or embedding context.
This is a recursive module, so you can add keep
and remove
at the top level or within a view
.
// The customization object
{
remove: [ ... ], // Optional. Global elements to remove.
keep: [ ... ], // Optional. Global elements to retain.
views: { // Supports the following:
list: { ... }, // The Asset List
design: { ... }, // The Dashboard Editor
preview: { ... }, // Preview mode of a Dashboard
endUser: { ... } // Live, interactive end-user dashboard
}
}
Within each view, you can include the following:
Key | Type | Description |
---|---|---|
remove | string[] | List of UI controls to hide. |
keep | string[] | List of UI controls to retain (others at the same level will be removed). |
defaults | object | Default settings for specific functionality. |
subModules | object | Customizations for dependent components (e.g., chart panels, modals). |
subModules.conditional | array | List of rule-based customizations based on attributes (only for subModules ). |
The global verbs, keep
and remove
, are evaluated in order of precedence:
remove
: Removes matching keys.keep
: Keeps matching keys while removing all others at the same level.
To simplify configuration, wildcards can be used:
Pattern | Behavior |
---|---|
*string | Matches anything ending with string . |
string* | Matches anything starting with string . |
*string* | Matches anything containing string . |
Please Note:
- For the
keep
definition, if a key matches the pattern, it will be the only item on its level to remain in the structure. remove
is a placeholder to signal that a control is not available in embed mode or should never be shown to users.- You may configure
customization
dynamically at runtime based on user roles or application state. - The grammar is extendable and supports overrides for dependent widgets using
subModules
.
Full Example
const customization = {
// Global elements to remove
remove: ['navBar.appTitle'], // Remove the application title from the navigation bar
views: {
// List View Customization
list: {
remove: [
'controlBarLeft.qCreateDash', // Remove "Create" button
'controlBarRight.qSwitchView', // Remove "Switch View" option
'assetList.asset.optionMenu.qDeleteDash', // Remove "Delete" action
'assetList.asset.optionMenu.qDuplDash', // Remove "Duplicate" action
'assetList.asset.optionMenu.qShareDash' // Remove "Manage Sharing" actions
],
defaults: {
assetListViewMode: 'table' // Set "Table" as default view
}
},
// Design View Customization
design: {
remove: [
'menuBar.file.qMnuCreateDash', // Remove "New" option
'menuBar.file.qMnuDuplicateDash', // Remove "Duplicate" option
'menuBar.file.qMnuDeleteDash', // Remove "Delete" option
'*Themes' // Remove all theme-related options
],
keep: [
'*DownloadDash.qDashPDF' // Keep only "Download PDF" in download menu
],
subModules: {
chartPanel: {
keep: ['header.optionMenu.qDownloadChart.qChartPDF'], // Keep "Download PDF" in chart panel
remove: ['header.qChartSelection'] // Remove "Chart Selection" option
}
}
},
// Preview View Customization
preview: {
remove: ['filterPanel'], // Remove filter panel
subModules: {
chartPanel: {
keep: ['header.qChartName'] // Keep only chart name
}
}
},
// End-User View Customization
endUser: {
subModules: {
chartPanel: {
conditional: [
{
condition: {
field: 'category',
operator: '=',
value: 'metric'
},
keep: ['header.optionMenu.qDownloadChart.qChartPDF'] // Keep "Download PDF" only for metrics
}
]
}
}
}
}
};
The views
Parameters
View | Key | Description |
---|---|---|
design | controlBarRight.qDiscard | The button for discarding changes. |
design | controlBarRight.qPreview | Allows the preview mode visualization. |
design | controlBarRight.qPublish | The button for publishing a new version of the dashboard. |
design | controlBarRight.qStatus | The status label for the dashboard. |
design | downloadModal | The options associated with the download modal. |
design | downloadModal.qScheduleOption | The schedule button inside the download modal. |
design | downloadModal.qSubscribeExternalUsers | The option to add external users using the Enter key within the Subscribe tab. |
design | downloadModal.qSubscribeOption | The Subscribe tab within the Download modal. |
design | filterPanel | The filters panel. |
design | filterPanel.qAddFilter | The add button for the filter panel. |
design | header.qShareDash | The manage sharing icon. |
design | menuBar.file.qMnuCanvasSize | The canvas size option inside the file menu. Only available if the canvas mode is Fixed. |
design | menuBar.file.qMnuCreateDash | The new dashboard option inside the file menu. Only applies if no dashboardId was passed when embedding the widget. |
design | menuBar.file.qMnuDeleteDash | The delete dashboard option inside the file menu. Only applies if no dashboardId was passed when embedding the widget. |
design | menuBar.file.qMnuDownloadDash | Download options for the dashboard. |
design | menuBar.file.qMnuDownloadDash.qDashCSV | CSV download option. |
design | menuBar.file.qMnuDownloadDash.qDashExcel | Excel download option. |
design | menuBar.file.qMnuDownloadDash.qDashPDF | PDF download option. |
design | menuBar.file.qMnuDuplicateDash | The duplicate dashboard option inside the file menu. Only applies if no dashboardId was passed when embedding the widget. |
design | menuBar.file.qMnuOpenDash | The open dashboard option inside the file menu. Only applies if no dashboardId was passed when embedding the widget. |
design | menuBar.file.qShareDash | The manage sharing option inside the file menu. |
design | menuBar.grid | The grid menu. |
design | menuBar.insert.qMnuInsertChart | The insert chart group inside the insert menu. |
design | menuBar.insert.qMnuInsertChart.qMnuExistingChart | The option for inserting existing chart from the gallery for the insert menu. |
design | menuBar.insert.qMnuInsertChart.qMnuNewChart | The option for inserting a new chart from the chart builder for the insert menu. |
design | navBar | The main top bar. |
design | navBar.qBackButton | The back button on the nav bar. Only available when a dashboard is selected. |
design | toolBar.grid | The grid group inside the toolbar. |
design | toolBar.qCanvasSize | The canvas size option inside the toolbar. |
design | toolBar.qDownloadDash | Download options for the dashboard. |
design | toolBar.qDownloadDash.qDashCSV | CSV download option. |
design | toolBar.qDownloadDash.qDashExcel | Excel download option. |
design | toolBar.qDownloadDash.qDashPDF | PDF download option. |
design | toolBar.qInsertChart | The insert chart group inside the toolbar. |
design | toolBar.qInsertChart.qExistingChart | The option for inserting existing chart from the gallery for the toolbar. |
design | toolBar.qInsertChart.qNewChart | The option for inserting a new chart from the chart builder for the toolbar. |
design | toolBar.qResponsiveView | The responsive view group in the toolbar. |
endUser | downloadModal | The options associated with the download modal. |
endUser | downloadModal.qScheduleOption | The schedule button inside the download modal. |
endUser | filterPanel | The filters panel. |
endUser | filterPanel.qAddFilter | The add button for the filter panel. |
endUser | navBar | The main top bar. |
endUser | navBar.qBackButton | The back button on the nav bar. Only available when a dashboard is selected. |
list | assetList.asset.optionMenu.qDeleteDash | The delete option inside the menu for the list. |
list | assetList.asset.optionMenu.qShareDash | The manage sharing option inside the menu for the list. Also enables the sharing modal via the icon in card/table view. |
list | controlBarLeft.qCreateDash | The create button for the asset list. |
list | navBar | The main top bar. |
preview | controlBarRight | The list of options on the right side of the control bar. |
preview | filterPanel | The filters panel. |
preview | filterPanel.qAddFilter | The add button for the filter panel. |
preview | navBar | The main top bar. |
preview | navBar.qBackButton | The back button on the nav bar. |
Defaults
Enables you to set styles and other customizations for the dependent components.
defaults: {
customStyles:{
button: { 'color': '#200606' }
}
}
The following options are available for fontFamily
properties.
- 'Inter, serif'
- 'Roboto, sans-serif'
- 'Georgia, serif'
- 'Palatino Linotype, Book Antiqua, Palatino, serif'
- 'Times New Roman, Times, serif'
- 'Arial, Helvetica, sans-serif'
- 'Arial Black, Gadget, sans-serif'
- 'Comic Sans MS, cursive, sans-serif'
- 'Impact, Charcoal, sans-serif'
- 'Lucida Sans Unicode, Lucida Grande, sans-serif'
- 'Tahoma, Geneva, sans-serif'
- 'Trebuchet MS, Helvetica, sans-serif'
- 'Verdana, Geneva, sans-serif'
- 'Courier New, Courier, monospace'
- 'Lucida Console, Monaco, monospace'
View | Property | Type | Description | Example |
---|---|---|---|---|
list | assetListViewMode | string | Defines the default view mode for the asset list. | "card" or "table" |
--- | For Text Items | ---- | ---- | --- |
design | customStyles.text.alignText | string | Default align text for the text element. | "left", "center", "right", or "justify" |
design | customStyles.text.backgroundColor | string | Default background color. | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.text.borderColor | string | Default border color for the text element. | Example: '#000000', 'green', 'GREEN' |
design | customStyles.text.borderStyle | string | Default border Style | "solid", "dotted", "dashed", or "double" |
design | customStyles.text.borderWidth | string | Default border width | Any value between "1px" to "20px" |
design | customStyles.text.fontColor | string | Default font color for the text element | Example: '#000000', 'green', 'GREEN' |
design | customStyles.text.fontFamily | string | Default font for the text element | Ex: 'Lucida Console, Monaco, monospace' |
design | customStyles.text.fontSize | string | Default font size for the text element | Choose from: 8, 9, 10, 11, 12, 14, 15, 16, 18, 24, 30, 36, 48, 60, 72, or "96px" |
design | customStyles.text.fontStyle | boolean | Default font style for the text element (italic styling) | true |
design | customStyles.text.fontWeight | boolean | Default font weight for the text element (bold styling) | true |
design | customStyles.text.paddingBottom | number | Default padding bottom for the text element | "20px" |
design | customStyles.text.paddingLeft | number | Default padding left for the text element | "20px" |
design | customStyles.text.paddingRight | number | Default padding right for the text element | "20px" |
design | customStyles.text.paddingTop | number | Default padding top for the text element | "20px" |
design | customStyles.text.strike | boolean | Default strike for the text element | true |
design | customStyles.text.underline | boolean | Default underline for the text element | true |
--- | For Image Items | --- | --- | --- |
design | customStyles.image.aspect | string | Default aspect for image | "contain", "cover", or "fill" |
--- | For Button Items | --- | --- | --- |
design | customStyles.button.background | string | button background color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.button.color | string | button font color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.button.fontFamily | string | button fontFamily | 'Lucida Console, Monaco, monospace' |
design | customStyles.button.fontSize | string | button font size | Choose from 8, 9, 10, 11, 12, 14, 15, 16, 18, 24, 30, 36, 48, 60, 72, or "96px" |
design | customStyles.button.label | string | text for the element | "Any cool text you want" |
design | customStyles.button.url | string | url for the button click event | "www.any-cool-url.con" |
--- | For Header Items | --- | --- | --- |
design | customStyles.header.layoutWidth | string | width of the header | "screen" or "canvas" |
design | customStyles.header.backgroundColor | string | Background color for the header | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.header.height | string | Default header size. | Value should be between 10 and 300. |
design | customStyles.header.backgroundImageConfig | string | Default aspect for header background image | "contain", "cover" or "fill" |
design | customStyles.header.backgroundImageConfig | string | Background image for the header. | "www.any-cool-url.con" |
--- | For Tabs Items | --- | --- | --- |
design | customStyles.tab.backgroundColor | string | Tabs indicator color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.tab.border | string | Tabs' border color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.tab.fontColor | string | Tabs font color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.tab.fontSize | string | Tabs font size | '8px', '9px', '10px', '11px', '12px', '14px', '15px', '16px', '18px', '24px' or '30px' |
design | customStyles.tab.fontType | string | Tabs font type | Ex: 'Lucida Console, Monaco, monospace' |
design | customStyles.tab.generalSize | string | Default size for tabs | Ex: "20px" |
design | customStyles.tab.name | string | Label for the name of a new tab. | Ex: "My cool new label" |
design | customStyles.tab.selectorColor | string | Selected tab indicator color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.tab.widthType | string | Tabs definition for width type | "MANUAL", "AUTOMATIC", or "SAME_SIZE" |
--- | For Input Box Items | --- | --- | --- |
design | customStyles.filterCtrlInputBox.background | string | Background color for the Filter Control | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.border | string | Border color for the apply filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.buttonBackground | string | Background color of the apply filter button in the Filter Control | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.buttonBorder | string | Border color of the apply filter button in the Filter Control | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.buttonLabel | string | Label to display text on the apply filter button | "My label" |
design | customStyles.filterCtrlInputBox.buttonText | string | Text color of the apply filter button in the Filter Control | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.defaultValidator | string | Default validator selected for the Filter Control | Example: 'CONTAINS' |
design | customStyles.filterCtrlInputBox.disabled | Boolean | Disables the Filter Control | true or false |
design | customStyles.filterCtrlInputBox.font | string | Font color for the apply filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.fontFamily | string | List of font types for the Filter Control | 'Lucida Console, Monaco, monospace' |
design | customStyles.filterCtrlInputBox.label | string | Name definition in the filter control, which can be a column name or any text from the panel configuration. | "My Label" |
design | customStyles.filterCtrlInputBox.listGroupings | array | Grouping list | Example: ['FULL_YEAR','DAY', 'MONTH', 'WEEK', 'YEAR'] |
design | customStyles.filterCtrlInputBox.placeHolder | string | Placeholder text for the filter field | "any string" |
design | customStyles.filterCtrlInputBox.selectedGrouping | string | Grouping selected by the user in interaction mode | 'FULL_DATE', 'DATE', 'YEAR' etc. |
design | customStyles.filterCtrlInputBox.selectedValidator | string | Validator selected by the user in interaction mode | Validator or Operator selected for the user in the Interactive Mode. |
design | customStyles.filterCtrlInputBox.selectorCheckboxes | string | Color of the selector checkbox | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlInputBox.triggerType | string | Displays the Apply Filter button or operates automatically | 'BUTTON' or 'AUTOMATIC' |
design | customStyles.filterCtrlInputBox.type | string | Default column type to load | 'NUMERIC', 'DATE', 'TEXT_LABEL' |
design | customStyles.filterCtrlInputBox.typeModule | string | For Inputbox, it should be 'inputbox'; for Filter Date, 'date'; and for Multiselect, 'multiselect' | 'inputbox' |
design | customStyles.filterCtrlInputBox.validatorsSelected | Object | Object for the validators/operators list | Example: [{id: 'EQUALS', label: 'Equals', 'action': 'EQUALS'}, {id: 'NOT_EQUAL', label: 'Not Equal', 'action': 'NOT_EQUAL'}] |
--- | For Multiselect List Items | --- | --- | --- |
design | customStyles.filterCtrlMultiSelectList.buttonBackground | string | Default background color for buttons | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.buttonBackground | string | Default background color for filter buttons | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.buttonBorder | string | Default border color for filter buttons | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.buttonLabel | string | Label to display the text on the apply filter button | "My Label" |
design | customStyles.filterCtrlMultiSelectList.buttonText | string | Default text color for filter buttons | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.defaultValidator | string | Default validator/operator to load | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.disabled | Boolean | Disables state of the Filter Control | true or false |
design | customStyles.filterCtrlMultiSelectList.font | string | Default font color | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.fontFamily | string | List of font types for Filter Control | 'Lucida Console, Monaco, monospace' |
design | customStyles.filterCtrlMultiSelectList.label | string | Defines the name in the filter control, which can be a column name or any text from the panel configuration. | Example: "Column name" |
design | customStyles.filterCtrlMultiSelectList.listItems | Object | List of elements to be selected in the Multi-select List | Example: [{"enabled": true, "value": "Abu Dabi", "valueid": "abudabi" }, {"enabled": true, "value": "Abu Dabi", "valueid": "abudabi"}] |
design | customStyles.filterCtrlMultiSelectList.multiSelectType | string | Groups of values. | 'LIST' or 'DROPDOWN' |
design | customStyles.filterCtrlMultiSelectList.placeholder | string | Default placeholder for the input field | "any string text" |
design | customStyles.filterCtrlMultiSelectList.selectedValidator | string | Validator/operator selected by the user | Example: [{id: 'EQUALS', label: 'Equals', 'action': 'EQUALS'}, {id: 'NOT_EQUAL', label: 'Not Equal', 'action': 'NOT_EQUAL'}] |
design | customStyles.filterCtrlMultiSelectList.selectorCheckboxes | string | Default color for the selector checkbox | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.triggerType | string | Shows the Apply Filter button or operates automatically | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlMultiSelectList.type | string | Default column type to load | Can be: 'NUMERIC', 'DATE', or 'TEXT_LABEL'. |
design | customStyles.filterCtrlMultiSelectList.typeModule | string | Multi-select 'multiselect' ; for Filter Inputbox: 'inputbox' ; and for Datepicker: 'date' . | 'multiselect' |
design | customStyles.filterCtrlMultiSelectList.validatorsSelected | Object | Object to list the validators/operators | Example: [{id: 'EQUALS', label: 'Equals', 'action': 'EQUALS'}, {id: 'NOT_EQUAL', label: 'Not Equal', 'action': 'NOT_EQUAL'}] |
--- | For Date Picker Items | --- | --- | --- |
design | customStyles.filterCtrlDatePicker.buttonBackground | string | Background color for the filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.buttonBackground | string | Background color for the apply filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.buttonBorder | string | Border color for the filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.buttonLabel | string | Sets text for the Apply Filter button | "My Label" |
design | customStyles.filterCtrlDatePicker.buttonText | string | Text color for the filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.defaultValidator | string | Default validator/operator to load | Example: 'EQUALS' |
design | customStyles.filterCtrlDatePicker.disabled | boolean | to toggle the disabled state of the filter control | true or false |
design | customStyles.filterCtrlDatePicker.font | string | Font color for the apply filter button | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.fontFamily | string | List of font types for the filter control | Example: 'Lucida Console, Monaco, monospace' |
design | customStyles.filterCtrlDatePicker.label | string | Sets a name for the filter control | "My Label" |
design | customStyles.filterCtrlDatePicker.placeholder | string | Default placeholder | "Some placeholder string" |
design | customStyles.filterCtrlDatePicker.selectedValidator | string | Validator or operator selected for the user in Interactive Mode | Example: 'EQUALS' |
design | customStyles.filterCtrlDatePicker.selectorCheckboxes | string | Color of the selector checkbox | Examples: '#000000', 'green', 'GREEN' |
design | customStyles.filterCtrlDatePicker.triggerType | string | Sets default trigger action, either with a button or automatic mode (on blur) | 'BUTTON' or 'AUTOMATIC' |
design | customStyles.filterCtrlDatePicker.type | string | Default column type to load | 'NUMERIC', 'DATE', 'TEXT_LABEL' |
design | customStyles.filterCtrlDatePicker.typeModule | string | Multi-select 'multiselect' ; for Filter Inputbox: 'inputbox' ; and for Datepicker: 'date' . | 'date' |
design | customStyles.filterCtrlDatePicker.validatorsSelected | Object | Object to list the validators/operators | Example: [{id: 'EQUALS', label: 'Equals', 'action': 'EQUALS'}, {id: 'NOT_EQUAL', label: 'Not Equal', 'action': 'NOT_EQUAL'}] |
--- | For Filter Panel Items | --- | --- | --- |
design, preview, enduser | filterSettings.defaultCollapsed | boolean | Default value for the configuration option collapsed | true or false |
design, preview, enduser | filterSettings.displayIcon | boolean | Default value for the display icon option in the filter panels settings | true or false |
design, preview, enduser | filterSettings.displayColor | boolean | Default value for the display color option in the filter panels settings | true or false |
design, preview, enduser | filterSettings.scopeDashboardColor | string | Default color for filters created under the dashboard scope when displayed inside the filter panel | Examples: '#000000', 'green', 'GREEN' |
design, preview, enduser | filterSettings.scopeTabColor | string | Default color for filters created under the tab scope when displayed inside the filter panel | Examples: '#000000', 'green', 'GREEN' |
design, preview, enduser | filterSettings.scopePanelColor | string | Default color for filters created under the panel scope when displayed inside the filter panel | Examples: '#000000', 'green', 'GREEN' |
submodules
> Chart Panel
const subModules = {
chartPanel: {
keep: ['menu.download.pdf']
}
}
Key | Description |
---|---|
header | The entire header for the panel |
header.qChartName | The title of the panel |
header.qFitPanel | The fit-to-panel button |
header.qSorting | The sorting button |
header.qChartSelection | The chart selection button |
header.qFilter | The filter and the options for filtering |
header.optionMenu | The three dot button |
header.optionMenu.qEditChart | The edit option inside the three dot button |
header.optionMenu.qDuplicateChart | The duplicate option inside the three dot button |
header.optionMenu.qDownloadChart | The download option inside the three dot button |
header.optionMenu.qDownloadChart.qChartJPG | The JPG format in the download option |
header.optionMenu.qDownloadChart.qChartPDF | The PDF format in the download option |
header.optionMenu.qDownloadChart.qChartCSV | The CSV format in the download option |
header.optionMenu.qDownloadChart.qChartSummary | The CSV summary format in the download option |
header.optionMenu.qDownloadChart.qChartExcel | The Excel format in the download option |
header.qColumnReplacement | The column replacement section in column settings |
header.qColumnAggregation | The column aggregation section in column settings |
optionDateGrouping | The column date grouping section in column settings |
optionDateGrouping.qDayOnly | The option for (Day Month) in date grouping dropdown |
optionDateGrouping.qMonth | The option for (Month, Year) in date grouping dropdown |
optionDateGrouping.qMonthOnly | The option for (Month) in date grouping dropdown |
optionDateGrouping.qQuarter | The option for (Quarter, Year) in date grouping dropdown |
optionDateGrouping.qQuarterOnly | The option for (Quarter) in date grouping dropdown |
optionDateGrouping.qWeek | The option for (Week, Year) in date grouping dropdown |
optionDateGrouping.qYear | The option for (Year) in date grouping dropdown |
optionDateGrouping.qDay | The option for (Full Date) in date grouping dropdown |
optionDateGrouping.qHour | The option for (Date, Hour) in date grouping dropdown |
optionDateGrouping.qHourOnly | The option for (Hour) in date grouping dropdown |
optionDateGrouping.qMinute | The option for (Date, Minute) in date grouping dropdown |
optionDateGrouping.qMinuteOnly | The option for (Minute) in date grouping dropdown |
optionDateGrouping.qSecond | The option for (Date, Second) in date grouping dropdown |
optionDateGrouping.qSecondOnly | The option for (Second) in date grouping dropdown |
conditional
blocks
You can use the conditional
block to show/hide elements based on widget metadata or attributes (e.g., a chart's category). At present, the only valid value for the field
attribute is "category", which can have a value of: "metric", "chart", or "summary".
"conditional": [ // Please check your conditions to avoid any logical conflicts.
{
"condition": {
"field": "category",
"operator": "=",
"value": "metric"
},
"keep": ["*.download.excel"]
},
{
"condition": {
"field": "category",
"operator": "=",
"value": "chart"
},
"keep": ["*.download.pdf"]
}
]