The following illustration is a test of the “embed” function of Tableau Public. That means that the report was created in Tableau Desktop and uploaded to Tableau Public.

The Fürstenzug in Dresden (English: Procession of Princes) is a large, 102 meters wide, mural of a mounted procession of the rulers of Saxony. It is made up by about 23,000 porcelain tiles of Meissen (which is close to Dresden). It is known as the largest porcelain artwork in the world (description taken from https://en.wikipedia.org/wiki/F%C3%BCrstenzug).

I took photos of it and stitched them together. The Tableau viz is rather simple. I wanted to test the strange format and the usage of photos as background images.

Now there are several ways to embed.

• Use the code generated within the “Share” function of Tableau public
• Use the link and put it into an iframe
• Use a plugin for your content management system, if exists

The share function generates the following code for my example-report:

<div class="tableauPlaceholder" id="viz1577487019714" style="position: relative">

	<noscript>
		<a href="#">
			<img alt="Fürstenzug Dresden in einer Tableau Variante" src="..." style="border: none">
		</a>
	</noscript>

	<object class="tableauViz" style="display:none;">

		<param name="host_url" value="https%3A%2F%2Fpublic.tableau.com%2F"> 
		<param name="embed_code_version" value="3"> 
		<param name="site_root" value="">
		<param name="name" value="FuerstenzugDresden/Fuerstenzug">
		<param name="tabs" value="no">
		<param name="toolbar" value="no">
		<param name="static_image" value="https://public.tableau.com/static/images/Fu/FuerstenzugDresden/Fuerstenzug/1.png"> 
		<param name="animate_transition" value="yes">
		<param name="display_static_image" value="yes"><param name="display_spinner" value="yes">
		<param name="display_overlay" value="yes"><param name="display_count" value="yes">
	</object>
</div>                

<script type="text/javascript">                 
   	var divElement = document.getElementById('viz1577487019714');                    
	var vizElement = divElement.getElementsByTagName('object')[0];                    
	if ( divElement.offsetWidth > 800 ) { 
		vizElement.style.width='5615px';
		vizElement.style.height='680px';
	} 
	else if ( divElement.offsetWidth > 500 ) {
		vizElement.style.width='5615px';
		vizElement.style.height='680px';
	}
	else 
	{ 
		vizElement.style.width='100%';
		vizElement.style.height='700px';
	}                     
	var scriptElement = document.createElement('script');                   
	scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';                    
	vizElement.parentNode.insertBefore(scriptElement, vizElement);               
</script>

I included it in this page, but changed one thing before. The if-elseif-else section tries to set a useful width and height depending on the size of the document in which the Tableau report is to be embedded. In my case, where the width is 5615 pixel, I changed to width 100% which means that the original size is used and a horizontal scrollbar is shown.

Here is the result:

I didn’t test the iframe-alternative since I didn’t want to use a plugin that allows to use iframes.

The third alternative, a specialized plugin for Tableau Public, is promising. I’m using WordPress, so I’m talking about a WordPress Plugin. The name is WP-TAB Tableau Public Viz Block.

The usage is simple, just the URL of the report needs to be entered. Additionally, some viz settings can be configured:

• hide tabs (yes/no)
• hide toolbar (yes/no)
• device: default, mobile, desktop, tablet, phone
• width
• height

Unfortunately, the width parameter is not taking the % sign, so it is not possible to configure a with of 100% (which would use a horizontal scrollbar). When I use the real width of 5615 pixel, no scrollbar is shown, so it is not usable.

I left out the parameter width and heigth, which looks as follows:

Result: the standard-embedding as suggested by Tableau Public’s Share-function works and allows for all customizing that Tableau allows. The usage of the plugin is easier, but it is not possible to customize everything at the current time.