将过滤器应用于多个嵌入式tableau面板



我在网页上嵌入了两个Tableau面板,每个面板都使用单击";份额;Tableau Public上的按钮。我在第一个仪表板上有一个过滤器,当单击时,我也想将其应用于第二个仪表板。最简单的方法是什么?

这是我当前的代码:

<section class="py-5">
<div class="container px-5">
<h1 class="fw-bolder fs-5 mb-4">Heart Disease Study Data Analysis</h1>
<div class="card border-0 shadow rounded-3 overflow-hidden">
<!-- Dashboard 1 div -->
<div class='tableauPlaceholder' id='viz1623283782551' style='position: relative'><noscript><a href='#'><img alt='Dashboard ' src='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;He&#47;HeartDiseaseStudyAnalysis&#47;Dashboard&#47;1_rss.png' 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='HeartDiseaseStudyAnalysis&#47;Dashboard' />
<param name='tabs' value='no' />
<param name='toolbar' value='yes' />
<param name='static_image' value='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;He&#47;HeartDiseaseStudyAnalysis&#47;Dashboard&#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='language' value='en-US' />
</object>
</div>
</div>
<!-- </div> -->
<!-- </section> -->

<!-- <section class="py-5"> -->
<!-- <div class="container px-5"> -->
<!-- <h1 class="fw-bolder fs-5 mb-4">Heart Disease Study Data Analysis</h1> -->
<div class="card border-0 shadow rounded-3 overflow-hidden">
<!-- Dashboard 2 div -->
<div class='tableauPlaceholder' id='viz1623287413728' style='position: relative'><noscript><a href='#'><img alt='Dashboard 2 ' src='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;He&#47;HeartDiseaseStudyAnalysis&#47;Dashboard2&#47;1_rss.png' 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='HeartDiseaseStudyAnalysis&#47;Dashboard2' />
<param name='tabs' value='no' /><param name='toolbar' value='yes' />
<param name='static_image' value='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;He&#47;HeartDiseaseStudyAnalysis&#47;Dashboard2&#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='language' value='en-US' />
</object>
</div>
</div>
</div>
</section>
</main>

<!-- Dashboard 1 js -->
<script type='text/javascript'>                    
var divElement = document.getElementById('viz1623283782551');                    
var vizElement = divElement.getElementsByTagName('object')[0];                    
if ( divElement.offsetWidth > 800 ) { vizElement.style.width='100%';vizElement.style.height=(divElement.offsetWidth*0.75)+'px';} 
else if ( divElement.offsetWidth > 500 ) { vizElement.style.width='100%';vizElement.style.height=(divElement.offsetWidth*0.75)+'px';} 
else { vizElement.style.width='100%';vizElement.style.height='1477px';}                     
var scriptElement = document.createElement('script');                    
scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';                    
vizElement.parentNode.insertBefore(scriptElement, vizElement);                
</script>

<!-- Dashboard 2 js -->
<script type='text/javascript'>                    
var divElement = document.getElementById('viz1623287413728');                    
var vizElement = divElement.getElementsByTagName('object')[0];                    
if ( divElement.offsetWidth > 800 ) { vizElement.style.width='100%';vizElement.style.height=(divElement.offsetWidth*0.75)+'px';} 
else if ( divElement.offsetWidth > 500 ) { vizElement.style.width='100%';vizElement.style.height=(divElement.offsetWidth*0.75)+'px';} 
else { vizElement.style.width='100%';vizElement.style.height='1427px';}                     
var scriptElement = document.createElement('script');                    
scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';                    
vizElement.parentNode.insertBefore(scriptElement, vizElement);                
</script>

看起来您正在使用Tableau Server中共享选项中的嵌入代码。如果您希望在仪表板上应用持久性过滤器,则需要利用Tableau Javascript API,而不是嵌入选项。您可以在此处找到有关包含API和筛选工作簿的教程:https://help.tableau.com/current/api/js_api/en-us/JavaScriptAPI/js_api_concepts_filtering.htm

最新更新