我理解,可以使用类似于以下 HTML 代码的方法嵌入 Tableau 视图:
<script type="text/javascript" src="http://tableau/javascripts/api/viz_v1.js">
我希望生成一个包含“name”参数值的下拉菜单的页面。基本上,当我在下拉菜单中选择一个值时,它会刷新与所选值相关联的tableau可视化部分的页面片段。由于我还在学习JavaScript,因此我一直在努力解决这个问题。
目前我的进展如下:
<html>
<head>
<meta charset="utf-8">
<title>Tableau Test</title>
<script type="text/javascript" src="http://tableau/javascripts/api/viz_v1.js">
function selectViz() {
var mylist=document.getElementById("tableau_workbook");
var wbName=document.getElementByName("name");
wbName.setAttribute("value",mylist.options[mylist.selectedIndex].value);
}
</script>
</head>
<body>
<form>
<!-- Dropdown Menu, the value corresponds with those found in the "name" parameter in the tableau view code -->
<select id="tableau_workbook" onchange="selectViz()" >
<option>Choose Workbook</option>
<option value="view_0/view_0">bioapps_single</option>
<option value="view_1/view_1">bioapps_merged</option>
</select>
<!-- Tableau view goes here -->
<div id="tableau_view" class="tableauPlaceholder" style="width:1028px; height:804px;" >
<object class="tableauViz" width="1028" height="804" style="display:none;">
<param name="host_url" value="http%3A%2F%2Ftableau%2F" />
<param name="site_root" value="" />
<param name="name" value="view_0/view_0" />
<param name="tabs" value="no" />
<param name="toolbar" value="yes" />
</object>
</div>
</form>
</body>
</html>
目前我还没有访问Tableau JavaScript API的权限,所以我正在尝试使用原始的HTML / JavaScript完成所有操作。不太确定我是否做得正确。非常感谢您的帮助。
谢谢,
Young
错误
:当下拉框被更改时,代码失败了。这是因为我们嵌入 Tableau 报告的 div 中已经存在一个 Viz。添加了 viz dispose,解决了你提到的当前状态不起作用的问题。点赞。 - Deep Kalra