Embedding Dashboards using an iFrame

You can use iFrames to embed dashboards into the HTML document of your choice, offering an easy solution to displaying your dashboards in other pages or applications external to Zoomdata. Zoomdata's automatically generated iFrame code allows users without access to your Zoomdata environment to view and interact with dashboards. There are two options for embedding dashboards from which to select: Interactive and Non-Interactive. Interactive allows users to click on elements within the dashboard. Non-Interactive provides a static snapshot of the dashboard.

Steps for Locating the iFrame Code for Embedding

  1. In the dashboard that you want to share, click the Share icon.
  2. Select the type of dashboard you want to embed: Interactive or Non-Interactive.
  3. Copy the Embed code, which is an HTML iFrame element.
  4. Add the embed code to your application's code. Zoomdata has already included the necessary parameters to allow public viewing of the dashboard.

The following example shows code that is being used to embed a dashboard view in an iFrame.

<iframe frameborder="0" src="http://yourserver/zoomdata/visualization/0987654321
   ?__target=embedded&key=1234567890" style="overflow: hidden; height: 100%; width: 100%"></iframe>

in which:

  • yourserver is replaced with the URL for your server.
  • 0987654321 is a id unique to the chart or dashboard being rendered.
  • 1234567890 is replaced with your security key. For information about generating an security key, see Generating a Security Key.

You can style the iFrame as with any other iFrame.