2016-05-14 63 views
1

的Javascript API我有为的Tableau

  • 2片
    • 条形图(片材称为BAR)
    • 饼图一个画面的工作簿(片材称为PIE)
  • 2仪表板
    • 条形图full scr EEN(片材称为FULLBAR)
    • 饼图全屏(片材称为FULLPIE)

查阅即时试图将它们加载到一个HTML页面和按钮,用于仪表板之间切换。我遵循教程,它将初始仪表板(FULLBAR)拉好,但仪表板切换是我遇到问题的地方。

当点击一个链接切换我在控制台

Error: Sheet is not found in Workbook 

这里得到这个错误是我的代码(服务器显然XXXX'ed出)

<!doctype html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>Proof of Concept</title> 
     <meta name="description" content="Proof of Concept"> 
     <meta name="author" content="thisDude"> 

     <script type="text/javascript" src="http://xxx.xxx.xxx.xxx:xxxx/javascripts/api/tableau-2.0.0.js"></script> 

     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
     <script type="text/javascript" src="js/bootstrap.js"></script> 
     <script type="text/javascript" src="js/app.js"></script> 
     <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> 
     <link rel="stylesheet" type="text/css" href="css/style.css"> 

</head> 
<body> 
    <div class='container'> 
     <div class='row'> 
      <div class='span3 col-xs-6'><img style="height:39px; width:100px;" src="logo.jpg" ></div> 
      <h2 class='col-xs-6 span7 pagination-centered'>Proof of Concept</h2> 
     </div> 
     <div class='row'> 
      <h3 class='offset3 span7 pagination-centered' id='sheetName'></h3> 
     </div> 
     <div class='row'> 

      <!-- All of our work will happen here --> 
      <!-- Viz located at http://xxx.xxx.xxx.xxx:xxxx/views/TEST_VIS2/FULLBAR --> 
      <ul id = 'menu' class='nav nav-list offset1 span2'> 
       <!-- This is the menu where we will add all of our buttons. --> 
       <li class='nav-header'>Switching Views</li> 
       <li><a onClick="switchView('FULLBAR')">Bar Chart</a></li> 
       <li><a onClick="switchView('FULLPIE')">Pie Chart</a></li>     
      </ul> 
      <div id='tableauViz'></div> 
      <script> 
      </script> 


      <!-- This is the end of the section where we will do our work. --> 
     </div> 
    </div> 
</body> 
</html> 

和我app.js代码:

window.onload=function() { 
    var vizDiv = document.getElementById('viz'); 
    var vizURL = "http://xxx.xxx.xxx.xxx:xxxx/views/TEST_VIS2/FULLBAR_1"; 
    var options = { 
     width: '100%', 
     height: '500px', 
     hideToolbar: true, 
     hideTabs: true 
    }; 

    viz = new tableauSoftware.Viz (vizDiv, vizURL, options); 
}; 

function switchView(sheetName) { 
    workbook = viz.getWorkbook(); 
    workbook.activateSheetAsync(sheetName); 
    console.log(sheetName); 
    console.log(workbook + " workbook var"); 
    console.log(viz.getWorkbook() + " viz.getWorkbook var"); 
} 

回答

1

找到了答案 -

我最初使用“将表格显示为制表符”选项向服务器发布了DESELECTED。我的JavaScript也使用hideTabs:true。

这样做会导致JS API不知道工作表的名称。

通过在发布“将表格显示为标签”期间选择该选项,API能够正确切换可视化。 js选项“hideTabs:true”仍然保持隐藏视觉选项卡。

+0

谢谢!你给了我几个小时。 – MarkHoward02