Add some Spotfire visualizations to your website using iframes

Embedding a Spotfire dashboard into your website is as simple as including the web player URL of you dashboard into an iframe on your html page.

• The html code for the visualization above can be seen below, then we’ll break down each part of the code to see everything at work:
  <div class=”content” style=”text-align: center;”><iframe src=”https://spotfire.syntelli.com/spotfireweb/ViewAnalysis.aspx?file=/Blog_Content/TreemapEmbed&amp;options=1-0,2-0,3-0,4-0,5-0,6-0,7-1,8-1,9-1,10-0,11-1,12-0,13-0,14-0,15-0″ width=”450″ height=”325″></iframe></div>

• <div class=”content” style=”text-align: center;”> … </div>
  First we wrap our code in a simple DIV tag.  In this case we add a style to our DIV tag to center our visualization on the page.

• <iframe src=”…” > </iframe>
  Next comes the iframe.  The iframe embeds a website inside another website.  First we tell the iframe the URL source, or ‘SRC=’  of the website we want our iframe to pull up.  We could just point our iframe directly to the web player URL of our dxp file:
  “https://spotfire.syntelli.com/spotfireweb/ViewAnalysis.aspx?file=/Blog_Content/TreemapEmbed”
  But Spotfire gives us additional options that we can append at the end of our URL string to customize the view.  To learn more about these options by visiting the Spotfire Tips and Tricks page here: Parameterizing Your Dashboard

• width=”450″ height=”325″
  The last piece of the code specifies the size of the iframe inside our webpage.