2016-05-14 31 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