string
Your Bold BI application URL needs to be assigned to this member.
Default value : empty
Example
var dashboard = BoldBI.create({
serverUrl: "https://mydashboard.com/bi/site/site1",
});
dashboard.loadDashboard();
string
The Id of the dashboard, which needs to be embedded in a page from your Bold BI application.
Default value : empty
Example
var dashboard = BoldBI.create({
dashboardId: "5cb065f7-dabb-4b0c-9b45-c60a5730e963"
});
dashboard.loadDashboard();
string
This will hold the dashboard path as category name followed by dashboard name.
Syntax
Default value : empty
Example
var dashboard = BoldBI.create({
dashboardPath: "/Samples/Sample Dashboard"
});
dashboard.loadDashboard();
string
The name of the pinboard that needs to be embedded in a page from your Bold BI application.
Default value : empty
Example
var pinboard = BoldBI.create({
pinboardName: "Pinboard Name"
});
pinboard.loadPinboard();
string
The Id of a div element in which the dashboard will be initialized and rendered.
Default value : empty
Example
<div id="container"></div>
<script>
// Embed Dashboard
var dashboard = BoldBI.create({
embedContainerId: "container",
});
dashboard.loadDashboard();
</script>
object
Providing the two types of embedding. One is component
and the other is iframe
. In component type, you will use the embedding SDK for rendering the dashboard. In iframe type, you will load the dashboard URL in the iframe and the dashboard will be rendered.
Possible values
Default value
Example
var dashboard = BoldBI.create({
embedType: BoldBI.EmbedType.Component,
});
dashboard.loadDashboard();
object
Environment refers to the Bold BI application type. Bold BI offers Cloud and Enterprise editions of the dashboard application. You need to assign your application type in this member.
Possible values
Default value
Example
var dashboard = BoldBI.create({
environment: BoldBI.Environment.Enterprise,
});
dashboard.loadDashboard();
object
Mode refers to the dashboard rendering mode such as view
, design
, connection
, and datasource
. The default value was view, which is used to render the dashboard for viewing.
Possible values
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.View,
});
dashboard.loadDashboard();
string
Set the height of the Dashboard Viewer in % or in pixels.
Default value
Example
var dashboard = BoldBI.create({
height:"768px",
});
dashboard.loadDashboard();
string
Set the width of the Dashboard Viewer in % or in pixels.
Default value
Example
var dashboard = BoldBI.create({
width:"1024px",
});
dashboard.loadDashboard();
object
Bold BI provides dark theming support for Dashboard Viewer. So, user can choose the desired theming for their choice.
Default value
Possible values
Example
var dashboard = BoldBI.create({
theme:BoldBI.Theme.Dark,
});
dashboard.loadDashboard();
string
This member supports filtering the dashboard in the following cases.
Default value
Example
var dashboard = BoldBI.create({
filterParameters: "Continent=Asia,Africa,Europe"
});
dashboard.loadDashboard();
Cases | Syntax | Example |
---|---|---|
URL Parameter |
{column_name}={value1},{value2},{value3} |
|
Dashboard Parameter |
{parameter_name}={parameter_value} |
|
Combination Of URL Parameter and Dashboard Parameter |
{column_name}={value1},{value2},{value3}&&{parameter_name}={parameter_value} |
|
Combination Of Dashboard Parameter and URL Parameter |
{parameter_name}={parameter_value}&{column_name}={value1},{value2},{value3} |
|
boolean
Specifies whether to show or hide the Auto Recover
Popup in the Dashboard Designer.
Default value
Example
var dashboard = BoldBI.create({
disableAutoRecover: false,
});
dashboard.loadDashboard();
boolean
Specifies whether the bingMap related files have to download or not.
Default value
Example
var dashboard = BoldBI.create({
isBingMapRequired: true,
});
dashboard.loadDashboard();
You can set a culture for the current user using the API in embedding.
For example, if you configure the widget to showcase the currency value, it will be displayed with Auto (English(en-US))
format by default as shown in the following image.
And the values in the widget will be rendered as follows,
You can embed the Bold BI dashboards in your web page by following the steps in this link.
After embedding the dashboard, you can change the culture settings on the embedding dashboard instance to get the desired currency format by passing it using the following highlighted API.
After this, the values in the widget will be displayed as follows within your application.
boolean
Enable or disable the header panel in the Dashboard Viewer.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
showHeader: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Export
icon in dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
showExport: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Refresh
icon in dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
showRefresh: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Option
icon in dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
showMoreOption: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Theme
icon in the dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
enableTheme: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Filter Overview
icon in the dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
enableFilterOverview: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Full Screen
icon in dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
enableFullScreen: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Dashboard Parameter
icon in dashboard banner.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
showDashboardParameter: true,
}
});
dashboard.loadDashboard();
Single Tab Dashboard
Specifies whether or not to update the Dashboards name in the header section.
Default value : empty
Example
var dashboard = BoldBI.create({
dashboardSettings: {
dashboardName: "name",
}
});
dashboard.loadDashboard();
Multi Tab Dashboard
Specifies the unique id of the dashboard if it is present within the multi-tab dashboard and mention the name in which dashboard to be rendered.
Default value
Example
var dashboard = BoldBI.create({
dashboardSettings: {
dashboardName: [
{ dashboardId: "fb63ae99-83b6-4752-97b7-890182a3729f", dashboardName: "value 1" },
{ dashboardId: "77fd95ce-ec8b-4f68-817c-f41cabfabd3a", dashboardName: "value 2" }
]
}
});
dashboard.loadDashboard();
boolean
Specify whether to show or hide the PreviewAs
option in the designer preview.
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
showPreviewAs: true //By default, the previewAs button will be shown.
}
});
dashboard.loadDesigner();
boolean
Specify whether to show or hide the Default Widgets
panel tab in the dashboard designer banner.
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
widgetsPanel :{
hideDefaultWidgets: false // By default, the Default Widgets will be shown.
}
}
});
dashboard.loadDesigner();
boolean
Specify whether to show or hide the Existing Widgets
panel tab in the dashboard designer banner.
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
widgetsPanel :{
hideExistingWidgets: false // By default, the Existing Widgets will be shown.
}
}
});
dashboard.loadDesigner();
Array
The existing dashboard widgets can be added to the existing panel tab in the designer settings.
Default value : empty
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
widgetsPanel :{
existingDashboards: [], //Here you are able to pass the n number of dashboard ids.
}
}
});
dashboard.loadDesigner();
boolean
Specify whether to show or hide the Data source
configuration button in the dashboard designer banner.
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
dataSourceConfig :{
hideDataSourceConfig: false // By default, the datasource configuration is shown.
}
}
});
dashboard.loadDesigner();
boolean
Specify whether to show all the columns in the View Underlying Data
of the selected widgets or to show only the columns of data used in the selected widget. This member would be used by both viewer and designer of the dashboard.
Default value
Example
var dashboard = BoldBI.create({
mode: BoldBI.Mode.Design,
dashboardSettings: {
viewDataSettings :{
showAllColumns: false,// By default, show all columns is not checked in dashbaord Designer.
}
}
});
dashboard.loadDesigner();
var dashboard = BoldBI.create({
dashboardSettings: {
viewDataSettings :{
showAllColumns: false,//By default, show all columns is not checked in dashbaord Viewer.
}
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Export
icon in widget banner.
Default value
Example
var dashboard = BoldBI.create({
widgetSettings: {
showExport: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Option
icon in widget banner.
Default value
Example
var dashboard = BoldBI.create({
widgetSettings: {
showMoreOption: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Clear Filter
icon in widget banner.
Default value
Example
var dashboard = BoldBI.create({
widgetSettings: {
showFilter: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Maximize
icon in widget banner.
Default value
Example
var dashboard = BoldBI.create({
widgetSettings: {
showMaximize: true,
}
});
dashboard.loadDashboard();
Dashboard server provides dynamic connection string feature to fetch the data for rendering the dashboard.
boolean
Specifies whether to enable or disable the dynamic connection string feature.
Default value
Example
var dashboard = BoldBI.create({
dynamicConnection: {
isEnabled: false,
}
});
dashboard.loadDashboard();
boolean
This property, holds the values that will be passed to the API in dynamic connection string feature so that the user can use this identity in their API for validating and providing the required connection string.
Default value : empty
Example
var dashboard = BoldBI.create({
dynamicConnection: {
isEnabled: true,
identity: "",
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Excel
export option.
Default value
Example
var dashboard = BoldBI.create({
exportSettings: {
showExcel: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the PDF
export option.
Default value
Example
var dashboard = BoldBI.create({
exportSettings: {
showPDF: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the Image
export option.
Default value
Example
var dashboard = BoldBI.create({
exportSettings: {
showImage: true,
}
});
dashboard.loadDashboard();
boolean
Specifies whether to show or hide the CSV
export option.
Default value
Example
var dashboard = BoldBI.create({
exportSettings: {
showCSV: true,
}
});
dashboard.loadDashboard();
string
Any application that embeds Bold BI dashboard and widget needs to be authenticated with Bold BI server and this authentication flow requires sending the confidential information like user email, group details, and embed signature to the Bold BI server. So, you need to implement this authentication flow in your server application and provide the URL for connecting to your server in Bold BI embed instance.
So this property holds the URL of the embedding application that will implement authorization. Learn more about the authorization server here.
Default value : empty
Example
var dashboard = BoldBI.create({
authorizationServer: {
url:"https://serversample.com/embed-details/get",
}
});
dashboard.loadDashboard();
object
This property, holds the headers needs to be sent in your application while connecting to the authorization server.
Default value
Example
var dashboard = BoldBI.create({
authorizationServer:{
headers: {
"Authorization": "Bearer eDIHDIJAdjakdnajdbaidhoasjasajnsJNININfsbfskdnskdnskdn"
}
}
});
dashboard.loadDashboard();
number
Specifies the access token expiration time of the dashboard in seconds.
Default value
Example
var dashboard = BoldBI.create({
expirationTime:100000,
});
dashboard.loadDashboard();
The auto refresh allows you to configure the scheduled refreshing process of the dashboard. It is used to refresh the data based on the specified time.
boolean
Specifies whether to enable or disable the autoRefreshSettings
option.
Default value
Example
var dashboard = BoldBI.create({
autoRefreshSettings:{
enabled: false,
}
});
dashboard.loadDashboard();
number
Specifies the hourly time interval for auto refreshing of data.
Default value
Example
var dashboard = BoldBI.create({
autoRefreshSettings:{
enabled: true,
hourlySchedule: {
hours: 1,
}
}
});
dashboard.loadDashboard();
number
Specifies the minute by minute time interval for auto refreshing of data.
Default value
Example
var dashboard = BoldBI.create({
autoRefreshSettings:{
enabled: true,
hourlySchedule: {
minutes: 10,
}
}
});
dashboard.loadDashboard();
number
Specifies the second by second time interval for auto refreshing of data.
Default value
Example
var dashboard = BoldBI.create({
autoRefreshSettings:{
enabled: true,
hourlySchedule: {
seconds: 30,
}
}
});
dashboard.loadDashboard();
The locale allows you to change the localization of the dashboard. It is used to change the data based on the specified localization.
string
This property holds the values that will be passed to the dashboard in order to change the culture of dashboard.
Default value
Example
var dashboard = BoldBI.create({
localeSettings:{
culture: "en-US",
}
});
dashboard.loadDashboard();
string
This property holds the values that will be passed to the dashboard in order to change the language of dashboard. This can also be done in dashboard designer, data source, widget.
Default value
Before setting the language to the dashboard in embedding level, you should have or generate respective language localization file in your Bold BI Server installed location. Please refer here to generate new locale file. Then, you can able to change the language by using the appLocale
API in embedding level.
Example
Note For setting fr-FR language in embedding, I have generated respective locale file in the Bold BI Server installed location.
var dashboard = BoldBI.create({
localeSettings:{
appLocale: "fr-FR",
}
});
dashboard.loadDashboard();
boolean
Enable or disable the header panel in the pinboard.
Default value
Example
var dashboard = BoldBI.create({
pinboardSettings: {
enablePinboardHeader: true,
}
});
dashboard.loadPinboard();
boolean
Enable or disable the unPin option from the Pinboard.
Default value
Example
var dashboard = BoldBI.create({
pinboardSettings: {
enableUnpinWidget: true,
}
});
dashboard.loadPinboard();
integer
Customize the dashboard margins with the corresponding integer values.
Default value
Example
var dashboard = BoldBI.create({
designCanvasSettings: {
margin: null,
}
});
dashboard.loadDashboard();
integer
Customize the widget margins with the corresponding integer values.
NOTE: It is not necessary to specify the px suffix. It support only integer values.
Default value
Example
var dashboard = BoldBI.create({
widgetContainerSettings: {
margin: null,
}
});
dashboard.loadDashboard();
string
Customize the box-shadow of the widgets.
Default value
Example
var dashboard = BoldBI.create({
widgetContainerSettings: {
boxShadow: null,
}
});
dashboard.loadDashboard();
array
This property is used to add multiple data sources to the designer page. You can customize the Datasource properties by the following options.
canEdit
- specifies whether to enable or disable the edit icon in the Datasource.canDelete
- specifies whether to enable or disable the delete icon in the Datasource.Example
var dashboard = BoldBI.create({
datasources: [
{"id": "348e414b-c8c6-4542-839a-2e12934fe64f", "canEdit": true, "canDelete": false},
{"id": "d9a28bba-e6dd-46c9-89d7-810ebb4796b3", "canEdit": false, "canDelete": true}
]
});
dashboard.loadDesigner();
Predefined or Preconfigured widgets are a list of widgets that appear under ‘Default Widget Panel’ while initializing the dashboard designer itself. For this, you need to create a dashboard called template dashboard and configure the widgets that will be considered as predefined widgets for your designer.
string
The preconfigured widgets will be listed from the mentioned dashboard Id within the dashboard designer embedded in your application.
Default value : empty
Example
var dashboard = BoldBI.create({
preConfiguredWidgets: {
dashboardId: "",
}
});
dashboard.loadDesigner();
string
The name of the category where the widget to be added in designer.
Default value : empty
Example
var dashboard = BoldBI.create({
preConfiguredWidgets: {
categoryName: "",
}
});
dashboard.loadDesigner();
NOTE:
- If the
categoryName
already exists, the predefined widgets were added to that category.- If the
categoryName
not exists in the panel, the widgets were added by creating a new category with the given name.- Otherwise, by default, the widgets were added to the
Miscellaneous
category.