Tableau HTML script

Questions ArchiveCategory: Web DevelopmentTableau HTML script
Madsen Baum asked 2 years ago

When we copy the embed link from Tableau into the HTML, do you we need a separate <script> for each one? Or do you only need one on the page to work for all the charts?

2 Answers
James Gaskin answered 2 years ago

There should be three separate embed scripts (one for each chart).

Blake Doty answered 2 years ago

That is a good question- I used a separate script for each one. You might want to do this just to be safe, and also so that it will still work if you have some Tableau dashboards that are different sizes. 
Also here’s a pro tip: After you paste the embed code from the Tableau dashboard you want to embed into your webpage, hit Shift + Alt + F on Windows or Shift + Option + F on Mac to automatically format your HTML code. This will give you a nice starting point from which to clean up the HTML formatting and the Javascript formatting. 
Also, in order to make the dashboards smaller, you will have to change the dimensions from Tableau itself. It looks like they recently changed how embedding Tableau dashboards in HTML works, so you will have to change the dimensions of the Tableau dashboard in Tableau itself and then copy the embed link into your code. However, you can then tweak the sizing further by using the min-height and min-width attributes of CSS, and applying these styles to the divs that contain the embed code for the Tableau dashboards. 
Here is how to change the dimensions of a Tableau dashboard:
I recommend using either the Fixed or Range options. 
If your dashboards are different sizes, then I recommend using a script tag for each embedded Tableau dashboard, because the Javascript code that is generated will set the Tableau dashboard to those dimensions based on the size of your window (this is only if you are using the Range option). If you are using the Fixed option, and still use different dimensions for each dashboard, then you should still include the script tag for every embedded dashboard. 

Madsen Baum replied 2 years ago

Thanks a lot! This was super helpful! Also, just to clarify, the instructions say that we should export the tableau things as charts, not dashboards. Is that right?
“Create and export four Tableau charts as live graphs that answer the following questions”

I didn’t make Dashboards in Tableau, rather I made 4 individual charts and them pasted them directly into HTML. I think this is so that we can comment on each chart. That’s what the instructions also say (and not to make the comments in Tableau).

Your Answer

3 + 3 =