Docs Menu

Embed Dashboards with an iframe

On this page

You can embed a dashboards into a web application with an iframe and specify settings such as height, width, refresh interval, and display theme.

You can embed only dashboards that don't require authentication (unauthenticated) within an iframe.

1

From your dashboard page, select the dashboard to embed.

2

From the dashboard, click at the top-right of the dashboard to access its embedding information. Select Embed from the dropdown menu.

3

If you have already enabled external sharing on the data source that this dashboard uses, skip this step. If you haven't yet enabled embedding on the data source, you can do so now. Click the Configure link.

4
5
6

Selecting the Iframe panel reveals the iframe embedding code and allows you to set autorefresh and display theme options.

7
  1. Specify the maximum age of data to load from the cache when loading or refreshing the embedded dashboard.
  2. Specify whether the embedded dashboard automatically refreshes.
  3. Select the Light or Dark display theme for your embedded dashboard.
  4. Specify whether to fix the width of the charts within the dashboard or to scale the width of the charts to fit the embedded dashboard.
  5. Specify whether to fix the height of the charts within the dashboard or to scale the height of the charts to fit the embedded dashboard.
  6. Specify whether to display the title and description on the embedded dashboard.
8

The iframe embedding code contains your dashboard's base URL and dasboard ID, as well as any options you have set.

9

You can edit the iframe code manually to set several other dashboard options, including height, width, and border radius. To learn more, see Embedded Dashboard Options.

After your iframe code is ready with any options you've set, you can place it in a web page to display your dashboard.

←  Embed Dashboards in Your Web ApplicationEmbed Dashboards with the Embedding SDK →
Give Feedback
© 2022 MongoDB, Inc.

About

  • Careers
  • Investor Relations
  • Legal Notices
  • Privacy Notices
  • Security Information
  • Trust Center
© 2022 MongoDB, Inc.