How to hide the header section in the embedded dashboard?

In some cases, you may want to hide the header of an embedded dashboard for a cleaner look or to save space. This can be achieved using the API member dashboardSettings.showHeader. This is a boolean property that can be set to false to hide the header of the embedded dashboard.

Steps to Hide the Header of an Embedded Dashboard

1. In the BoldBI.create() method of the embedded application, add the API member dashboardSettings.showHeader and set it to false. This will hide the header of the dashboard. Here is a code snippet for reference:

var dashboard = BoldBI.create({
    dashboardSettings: {
        showHeader: false,
    }
});
dashboard.loadDashboard();

The image below demonstrates the dashboard with the header hidden when setting the API dashboardSettings.showHeader to false.

2. If you want to enable the header of the embedded dashboard back, simply set this API to true. Here is a code snippet for reference:

var dashboard = BoldBI.create({
    dashboardSettings: {
        showHeader: true,
    }
});
dashboard.loadDashboard();

Additional References

• Show Header API Documentation
• JavaScript based dashboard embedding