使嵌入式Tableau响应 [英] Make Embedded Tableau Responsive

问题描述

使嵌入式Tableau响应快速

要使div响应，请为div创建一个CSS.

Make Embedded Tableau Responsive

http://www.tableau.com/learn/gallery/company-performance

The Embed Code as following:

<script type='text/javascript' src='http://public.tableau.com/javascripts/api/viz_v1.js'></script>
<div class='tableauPlaceholder' style='width: 944px; height: 789px;'>
<noscript>
<a href='http:&#47;&#47;www.tableau.com&#47;learn&#47;gallery'>
<img alt='Tale of 100 Entrepreneurs  ' src='http:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;Ta&#47;Tale-of-100-Entrepreneurs_14&#47;Taleof100Entrepreneurs&#47;1_rss.png' style='border: none' />
</a>
</noscript>
<object class='tableauViz' width='944' height='789' style='display:none;'>
<param name='host_url' value='http%3A%2F%2Fpublic.tableau.com%2F' /> 
<param name='site_root' value='' />
<param name='name' value='Tale-of-100-Entrepreneurs_14&#47;Taleof100Entrepreneurs' />
<param name='tabs' value='no' /><param name='toolbar' value='yes' />
<param name='static_image' value='http:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;Ta&#47;Tale-of-100-Entrepreneurs_14&#47;Taleof100Entrepreneurs&#47;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' />
<param name='showVizHome' value='no' />
<param name='showVizHome' value='no' />
<param name='showTabs' value='y' />
</object>
</div>

When embedded into web page, it is not responsive.

How to make it responsive?

解决方案

I assume you want only the tableau view you have embedded in your website to be responsive?

If yes, set the size of the dashboard to Automatic. This will allow the dashboard to adjust its size automatically based on the size the div appears.

To make the div responsive create a css for the div.

这篇关于使嵌入式Tableau响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！