Embed a multi-tab dashboard programmatically from a Bold BI dashboard using authorization server authentication.
Note:
To embed a multi-tab dashboard using Bold BI Server version 10.1.18 or later, you must use the following CDN link: https://cdn.boldbi.com/embedded-sdk/v10.1.18/boldbi-embed.js
If you are using a Bold BI Server version earlier than 10.1.18, use this CDN link instead: https://cdn.boldbi.com/embedded-sdk/v9.1.73/boldbi-embed.js
<div> in your frontend where the multi-tab dashboard will load.You can embed a multi-tab dashboard programmatically in two ways:
<body onload="embedSample();">
<div id="embed_container"></div>
<script>
function embedSample() {
var boldbiEmbedInstance = BoldBI.create({
serverUrl: "<Bold BI Server URL>",
dashboardIds: ["<Dashboard ID 1>", "<Dashboard ID 2>"], // The IDs of the dashboards to embed.
embedContainerId: "<Embed Container ID>",
authorizationServer: {
url: "<Authorization Server URL>"
}
});
boldbiEmbedInstance.loadTabbedDashboards(); // Use loadMultitabDashboard() for versions prior to v13.1.
}
</script>
</body><body onload="embedSample();">
<div id="embed_container"></div>
<script>
function embedSample() {
var boldbiEmbedInstance = BoldBI.create({
serverUrl: "<Bold BI Server URL>",
dashboardPaths: ["<Dashboard Path 1>", "<Dashboard Path 2>"], // The paths of the dashboards to embed.
embedContainerId: "<Embed Container ID>",
authorizationServer: {
url: "<Authorization Server URL>"
}
});
boldbiEmbedInstance.loadTabbedDashboards(); // Use loadMultitabDashboard() for versions prior to v13.1.
}
</script>
</body>Note: For more information on multi-tab dashboard members, methods, and events, refer to this link.