Members

dashboardId

string

Defines the ID of the dashboard to be embedded from your Bold BI application.

• Required: Yes
• Default: "" (empty)

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     dashboardId: "5cb065f7-dabb-4b0c-9b45-c60a5730e963"                
});
dashboard.loadDesigner();

dashboardPath

string

Stores the dashboard path in the format of category name followed by dashboard name.

• Syntax: /{category-name}/{dashboard-name}
• Default: "" (empty)

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     dashboardPath: "/Samples/Sample Dashboard"
});
dashboard.loadDesigner();

embedContainerId

string

The ID of a div element in which the dashboard will be initialized and rendered.

• Required: Yes
• Default: "" (empty)

Example

<div id="container"></div> 
<script> 
     // Embed Dashboard 
     var dashboard = BoldBI.create({
          mode: BoldBI.Mode.Design,
          embedContainerId: "container",        
     });
     dashboard.loadDesigner();
</script>

embedType

object

There are two types of embedding available: component and iframe. In the component type, you will use the embedding SDK to render the dashboard. In the iframe type, you will load the dashboard URL in the iframe and the dashboard will be rendered.

• Possible Values:
  • BoldBI.EmbedType.Component
  • BoldBI.EmbedType.IFrame
• Default: BoldBI.EmbedType.Component

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     embedType: BoldBI.EmbedType.Component,        
});
dashboard.loadDesigner();

embedToken

string

Stores the Embed Authorization API access token to reduce redundant API calls and improve performance.

• Required: No
• Default: "" (empty)
• Note: Supported from v12.1. Use the corresponding SDK and build version. Additionally we have created sample to explain how this api works

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     embedToken:  "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbWFpbCI6ImRldm9wc0Bib2xkYmkuY29tIiwidXBuIjouYm9sZGJpZGVtby5jb20vYmkvc2l0ZS9zaXRlMSIsImF1ZCI6Imh0dHBzOi8vaG90Zml4LXdpbmRvd3MuYm9sZGJpZGVtby5jb20vYmkvc2l0ZS9zaXRlMSJ9.JzbqVr6Brv1mAEvnbHnE-FuShos",
});
dashboard.loadDesigner();

environment

object

Specifies the type of Bold BI application, either Cloud or Enterprise edition.

• Possible Values:
  • BoldBI.Environment.Cloud
  • BoldBI.Environment.Enterprise
• Default: BoldBI.Environment.Enterprise

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     environment: BoldBI.Environment.Enterprise,        
});
dashboard.loadDesigner();

expirationTime

number

Specifies the access token expiration time of the dashboard in seconds.

• Required: No
• Default: 86400 (24 hours)

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     expirationTime:100000,          
});
dashboard.loadDesigner();

height

string

Defines the height of the embedding module in percentages or pixels.

• Optional: Yes
• Default: Inherits from the parent container

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     height:"800px", //The dashboard is now rendered with a height of 800px
});
dashboard.loadDesigner();

mode

object

Defines the dashboard rendering mode.

• Possible Values:
  • BoldBI.Mode.View
  • BoldBI.Mode.Design
  • BoldBI.Mode.Connection
  • BoldBI.Mode.DataSource
• Default: BoldBI.Mode.View

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,        
});
dashboard.loadDesigner();

serverUrl

string

The URL of the Bold BI application.

• Required: Yes
• Default: "" (empty)

Example

var dashboard = BoldBI.create({
     serverUrl: "https://mydashboard.com/bi/site/site1",
});
dashboard.loadDesigner();

token

string

Authenticates the dashboard without implementing the AuthorizeAPI endpoint.

• Required: No
• Default: "" (empty)
• Note: Refer to the token generation documentation for details.

Example

  
var dashboard = BoldBI.create({
     token: "NjQ2ZDgwZjgtN2Q3MS00ZDQwLWFkNTItYTdkNDRhOGE2NmVi", // Use the generated API key
});
dashboard.loadDesigner();

To learn about the available limited supporting methods in embedding.

width

string

Defines the width of the embedding module in percentages or pixels.

• Optional: Yes
• Default: Inherits from the parent container

Example

var dashboard = BoldBI.create({
     width:"1200px", //The dashboard is now rendered with a width of 1200px.
});
dashboard.loadDesigner();

authorizationServer

headers

object

Transmits custom data or header values to the embedding application’s Authorization Server. As a result, you may find this value in the headers of the Authorization Server API.

• Optional: Yes
• Default: {} (empty object)
• Note: Please refer to the Knowledge Base article to know more.

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     authorizationServer:{
          headers: {
               "Authorization": "Bearer eDIHDIJAdjakdnajdbaidhoasjasajnsJNININfsbfskdnskdnskdn"
          }
     }
});
dashboard.loadDesigner();

url

string

Any application that embeds a Bold BI dashboard and widget needs to authenticate with the Bold BI server. This authentication flow requires sending confidential information such as user email, group details, and embed signature to the Bold BI server. Therefore, you must implement this authentication flow in your server application and provide the URL for connecting to your server in the Bold BI embed instance.

• Required: Yes
• Default: "" (empty)
• Note: Refer to the authorization server documentation for details.

Example

var dashboard = BoldBI.create({
     mode: BoldBI.Mode.Design,
     authorizationServer: {
          url:"https://serversample.com/embed-details/get",
     }
});
dashboard.loadDesigner();

settings

bingMapRequired

boolean

Specifies whether Bing Map-related files need to be downloaded.

• Default: false
• Note: Set to true if the dashboard contains a Bing Map widget.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        bingMapRequired: false
    }
});
dashboard.loadDesigner();

datasources

array

Specifies the value to add multiple data sources to the designer page, allowing customization of data source properties.

• Options:
  • canEdit: Specifies whether to show or hide the edit icon in the data source.
  • canDelete: Specifies whether to show or hide the delete icon in the data source.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        datasources: [
            {"id": "348e414b-c8c6-4542-839a-2e12934fe64f", "canEdit": true, "canDelete": false},  
            {"id": "d9a28bba-e6dd-46c9-89d7-810ebb4796b3", "canEdit": false, "canDelete": true}
        ]
    }
});
dashboard.loadDesigner();

disableAutoRecover

boolean

Specifies whether to show or hide the Auto Recover Popup in the Dashboard Designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        disableAutoRecover: false
    }
});
dashboard.loadDesigner();

aiAssistant

Note: Please use the SDK and Bold BI server from the same version. Starting from version 13.1, the AI Assistant settings are restructured.

enabled

boolean

Enables the AI Assistant for generating and modifying widgets using natural language queries. The AI Assistant enhances widget creation and customization by leveraging advanced AI models, making data visualization more intuitive and accessible. This feature is available in both Cloud and Enterprise editions for Dashboard Viewer, and Dashboard Designer embeddings.

• Default: false
• Note: Ensure the SDK and Bold BI server versions match. Refer to here for more details.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true
        }
    }
});
dashboard.loadDesigner();

hideChatHelp

boolean

Specifies whether to show or hide the AI Chat Help icon in the AI Assistant window. Requires the aiassistantenabled to be set.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true,
            hideChatHelp: true
        }
    }  
});
dashboard.loadDesigner();

hideUsageAnalytics

boolean

Specifies whether to show or hide the AI Data Usage icon in the AI Assistant window. Requires the aiassistantenabled to be set.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true,
            hideUsageAnalytics: true
        }
    }  
});
dashboard.loadDesigner();

name

boolean

Customizes the title of the AI Assistant as desired. Requires the enabled member API.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
          enabled: true,
          name: "Embedded AI"
        }
    } 
});
dashboard.loadDesigner();

summary.enabled

boolean

Specifies whether to show or hide the dashboard and widget summary option. Requires the enabled member API.

• Default: false

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true,
            summary: {
               enabled: true
            }
        }
    }
});
dashboard.loadDesigner();

summary.dashboard

boolean

Specifies whether to show or hide the AI Dashboard Summary option in the dashboard banner. Requires both aiassistantenabled and summaryenabled member APIs.

• Default: false
• Note: Supported only in versions prior to 13.1. From 13.1 onwards, use settings.aiAssistant.summary.dashboard.

Default value

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true,
            summary: {
               enabled: true,
               dashboard: true
            }
        }
    }
});
dashboard.loadDesigner();

summary.widget

boolean

Specifies whether to show or hide the AI Widget Summary option in the widgets. Requires both aiassistantenabled and summaryenabled member APIs.

• Default: false
• Note: Supported only in versions prior to 13.1. From 13.1 onwards, use settings.aiAssistant.summary.widget.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        aiAssistant: {
            enabled: true,
            summary: {
               enabled: true,
               widget: true
            }
        }
    }
});
dashboard.loadDesigner();

brand

hideHelpLink

boolean

The hideHelpLink option allows you to show or hide the “Know More” option in the scrollable dashboard feature within Dashboard Designer and in the AI Assistant chat window.

Default value

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        brand: {
            hideHelpLink: true
        }
    }
});
dashboard.loadDesigner();

domain

string

The domain option allows you to define a link to your custom domain help documentation application instead of using our Bold BI help documentation link in the help icon of the “Know More” option in the scrollable dashboard feature within Dashboard Designer and in the AI Assistant chat window.

Default value : empty

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        brand: {
            domain: "https://yourdomain.com"
        }
     }
});
dashboard.loadDesigner();

name

string

The name option allows you to customize the name in the AI Assistant chat window.

Default value : empty

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        brand: {
            name: "Demo"
        }
     }
});
dashboard.loadDesigner();

designCanvas

margin

integer

Customize the margins of the dashboard using the corresponding integer values.

• Default: null

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designCanvas: {
          margin: 30
        }
    }
});
dashboard.loadDesigner();

export

csv

boolean

Specifies whether to show or hide the CSV export option in designer preview option.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        export: {
            csv: true
        }
    }
});
dashboard.loadDesigner();

excel

boolean

Specifies whether to show or hide the Excel export option in designer preview option.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        export: {
            excel: true
        }
    }
});
dashboard.loadDesigner();

image

boolean

Specifies whether to show or hide the Image export option in designer preview option.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        export: {
            image: true
        }
    }
});
dashboard.loadDesigner();

pdf

boolean

Specifies whether to show or hide the PDF export option in designer preview option.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        export: {
            pdf: true
        }
    }
});
dashboard.loadDesigner();

locale

The locale allows you to change the localization of the dashboard, modifying data based on the specified localization.

appLocale

string

Holds the value to change the language of the dashboard, data source, or widget.

• Default: en-US
• Note: Before setting the language at the embedding level, generate the respective language localization file in the Bold BI Server installed location. Refer to here to generate a new locale file.

Example

Note: The fr-FR language file has been generated in the Bold BI Server installed location.

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        locale: {
          appLocale: "fr-FR"
        }
    }
});
dashboard.loadDesigner();

culture

string

Holds the value to change the dashboard’s culture, affecting formats like currency.

• Default: en-US
• Note: You can set the culture for the current user via the API in embedding. For example, configuring a widget to display currency defaults to Auto (English(en-US)). After setting a custom culture, the widget reflects the new format.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        locale: {
          culture: "en-US"
        }
    }
});
dashboard.loadDesigner();

Additional Info:

• Default currency culture:
• Default grid view:
• Modified culture:
• Refer to Embedding In Your Application for setup steps. Use the cultureSettings API to adjust the culture post-embedding.

viewData

allColumns

boolean

Specifies whether to show or hide the display of all columns in the table in the View Underlying Data of the widget.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewData: {
            allColumns: true // Column options are all checked in the dashboard viewer and designer preview..
        }
     }
});
dashboard.loadDesigner();

columnSelection

boolean

Specifies whether to show or hide the “Select Column” button in the view underlying data of the widget.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewData: {
            columnSelection: false // Select column button will be hidden in the dashboard viewer and designer preview.
        }
    }
});
dashboard.loadDesigner();

exporting

boolean

Specifies whether to show or hide the export option in the view underlying data of the widget.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewData: {
            exporting: false // The Export option will be hidden in the dashboard viewer and designer preview.
        }
     }
});
dashboard.loadDesigner();

viewer

dashboardName

Specifies whether or not to update the Dashboards name in the header section for a Single Tab Dashboard.

• Default:
  • Single Tab Dashboard: "" (empty)
• Note: For Multi Tab Dashboard, these is no designer support.

Example (Single Tab Dashboard)

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewer: {
            dashboardName: "name"
        }
    }
});
dashboard.loadDesigner();

edit

boolean

Specifies whether to show or hide the Edit icon in dashboard banner.

Note: Edit icon will be show by default in dashboard viewer banner if the user has the designer permisson.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewer: {
            edit: false
        }
    }
});
dashboard.loadDesigner();

viewer.widgetContainer

boxShadow

string

Customize the box shadow of the widgets.

• Default: "" (empty)

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewer: {
            widgetContainer: {
                boxShadow: "10px 10px lightblue"
            }
        }
    }
});
dashboard.loadDesigner();

widgetContainer.margin

integer

Customize the margins of the widget with the corresponding integer values.

• Default: null
• Note: Do not specify the px suffix; only integer values are supported.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        viewer: {
            widgetContainer: {
                margin: 20
            }
        }
    }
});
dashboard.loadDesigner();

designer

previewAs

boolean

Specifies whether to display or hide the Preview as option in the designer preview.

• Default: true

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            previewAs: true // By default, the previewAs button will be shown.
        }
    }
});
dashboard.loadDesigner();

dataSourceConfig

hideDataSourceConfig

boolean

Specifies whether to show or hide the Data source configuration button in the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            dataSourceConfig: {
                hideDataSourceConfig: false // By default, the datasource configuration is shown.
            }
        }
    }
});
dashboard.loadDesigner();

hideDataSourceList

boolean

Specify whether to show or hide the Data source List dropdown configuration in the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            dataSourceConfig: {
                hideDataSourceList: false // By default, the datasource list dropdown is shown.
           }
        }
     }
});
dashboard.loadDesigner();

hideExpression

boolean

Specify whether to show or hide the Hide Expression configuration button in the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            dataSourceConfig: {
                hideExpression: false // By default, the add expression button is shown.
            }
        }
    }
});
dashboard.loadDesigner();

hideSampleDataSources

boolean

Specifies whether to show or hide the Sample Datasources option under the datasource configuration in the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            dataSourceConfig: {
                hideSampleDataSources: false // By default, the sample datasource option is shown.
            }
        }
    }
});
dashboard.loadDesigner();

preConfiguredWidgets

Predefined or preconfigured widgets are a list of widgets that appear under the Default Widget Panel when initializing the dashboard designer. To achieve this, create a template dashboard and configure the widgets to be considered as predefined widgets for your designer.

categoryName

string

Specifies the value to set the category name where the widget will be added in the designer.

• Default: "" (empty)
• Note:
  • If categoryName exists, predefined widgets are added to that category.
  • If categoryName does not exist, a new category with the given name is created.
  • Otherwise, widgets are added to the Miscellaneous category by default.

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            preConfiguredWidgets: {
                categoryName: ""
            }
        }
    }
});
dashboard.loadDesigner();

preConfiguredWidgets.dashboardId

string

Specifies the value to set the dashboard ID from which preconfigured widgets will be listed in the embedded dashboard designer.

• Default: "" (empty)

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            preConfiguredWidgets: {
                dashboardId: ""
            }
        }
    }
});
dashboard.loadDesigner();

widgetsPanel

existingDashboards

Array

The dashboard widgets can be added to the existing panel tab.

• Default: [] (empty array)

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            widgetsPanel: {
                existingDashboards: [] //Here you are able to pass the n number of dashboard ids.
            }
        }
    }
});
dashboard.loadDesigner();

hideDefaultWidgets

boolean

Please indicate whether to display or hide the Default Widgets panel tab in the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            widgetsPanel: {
                hideDefaultWidgets: false // By default, the Default Widgets will be shown.
            }
        }
    }
});
dashboard.loadDesigner();

hideExistingWidgets

boolean

Specifies whether to show or hide the Existing Widgets panel tab on the dashboard designer.

• Default: false

Example

var dashboard = BoldBI.create({
    mode: BoldBI.Mode.Design,
    settings: {
        designer: {
            widgetsPanel: {
                hideExistingWidgets: false // By default, the Existing Widgets will be shown.
            }
        }
    }
});
dashboard.loadDesigner();