9 Replies Latest reply on Apr 29, 2013 3:55 PM by Ioana Filipescu

    Tableau 8 javascript API

    Ioana Filipescu

      Anybody used the javascript API provided with Tableau 8?

      I'm trying to build a very simple html page based on their example of showing a Tableau view. But it's not working, nothing shows up. And i can't figure out why. Any hint would be appreciated.

      This is the code that i'm using:

       

      <script type="text/javascript">

       

              $(document).ready(function () {

                  initializeViz()

              });

             

              function initializeViz() {

                  var placeholderDiv = document.getElementById("tableauViz");

                  var url = "http://public.tableausoftware.com/views/WorldIndicators/GDPpercapita";

                  alert(url);

                  var options = {

                      hideTabs: true,

                      width: "800px",

                      height: "700px",    

                      onFirstInteractive: function () {

                                       workbook = viz.getWorkbook();

                                       activeSheet = workbook.getActiveSheet();

                     }           

                  };

                 var viz = new tableauSoftware.Viz(plachoderDiv, url, options);

              }

          </script>

       

      Thanks.

        • 1. Re: Tableau 8 javascript API
          Ashley Howard

          Trying to familiarize myself with the JavaScript and having a problem getting it to work when following the tutorial.  I know Russell Christopher has done some work previously using the JS API, curious to know his take.

          • 2. Re: Tableau 8 javascript API
            Russell Christopher

            Are you pointing to the JavaScript file itself somewhere else in the page? I don;'t your reference to it (You need to point to

            http://public.tableausoftware.com/javascripts/api/tableau_v8.js)

             

            It also looks like you're using JQuery ($(document).ready) -- is your reference to the JQuery file set?

             


            • 3. Re: Tableau 8 javascript API
              Ioana Filipescu

              Hi,

              Yes, i do have references to all js files, i just didn't post that. This is the whole header section:

               

              <head runat="server">

                <link type="text/css" href="js/smoothness/jquery-ui.css" rel="Stylesheet" />

                <script type="text/javascript" src="js/jquery-1.9.1.js"></script>

                <script type="text/javascript" src="js/jquery-ui-1.10.1.custom.js"></script>

                <script type="text/javascript" src="js/jquery-ui-1.10.1.custom.min.js"></script>

                <script type="text/javascript" src=" tableau_v8.js"> </script>

                  <script type="text/javascript">

               

                      $(document).ready(function () {

                          initializeViz()

                      });

                     

                      function initializeViz() {

                          var placeholderDiv = document.getElementById("tableauViz");

                          var url = "http://drishya001.wmg.com/views/WorldIndicators/GDPpercapita";

                          alert(url);

                          var options = {

                              hideTabs: true,

                              width: "800px",

                              height: "700px",    

                              onFirstInteractive: function () {

                                               workbook = viz.getWorkbook();

                                               activeSheet = workbook.getActiveSheet();

                             }           

                          };

                         var viz = new tableauSoftware.Viz(plachoderDiv, url, options);

                      }

                  </script>

              </head>

               

              Function initializeViz is called, i tested that with an alert, thing is i don't get anything displayed which makes me think i'm missing something and the tableauSoftware object is not created right.

              • 4. Re: Tableau 8 javascript API
                Russell Christopher

                Shouldn't this:

                 

                  <script type="text/javascript" src=" tableau_v8.js"> </script>

                 

                be....

                 

                  <script type="text/javascript" src="http://someserver/javascripts/api//tableau_v8.js"> </script>

                 

                Have you looked to see what error messages are being thrown in the browser?



                • 5. Re: Tableau 8 javascript API
                  Ioana Filipescu

                  I get no error, that's the thing.

                   

                  The have a copy of the js file on my machine. The reference is corect. I can't point to the Tableau server bc of security issues. I don't know if that's the problem, if the library should be ran from the server.........

                  • 6. Re: Tableau 8 javascript API
                    Russell Christopher

                    Can you post the entire page here zipped up?

                    • 8. Re: Tableau 8 javascript API
                      Russell Christopher

                      I took out the ASP.NET stuff (server side rendering) and was left with this:

                       

                      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

                       

                       

                      <html xmlns="http://www.w3.org/1999/xhtml">

                      <head>

                      <script type="text/javascript" src="http://server8/javascripts/api/tableau_v8.debug.js"></script>

                      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

                      <script type="text/javascript">

                       

                       

                              $(document).ready(function () {

                                  initializeViz()

                              });

                             

                              function initializeViz() {

                                  var placeholderDiv = document.getElementById("tableauViz");

                                  var url = "http://server8/t/SkunkWorks/views/LabelLocalizationEN/Dashboard";

                                  alert(url);

                                  var options = {

                                      hideTabs: true,

                                      width: "800px",

                                      height: "700px",    

                                      onFirstInteractive: function () {

                                                       workbook = viz.getWorkbook();

                                                       activeSheet = workbook.getActiveSheet();

                                     }           

                                  };

                                 var viz = new tableauSoftware.Viz(placeholderDiv, url, options);

                              }

                        

                        

                         

                       

                          </script>

                       

                       

                          <title></title>

                       

                        

                      </head>

                      <body>

                          <div id="tableauViz" style="width:800px; height:700px">

                          </div>

                       

                       

                      </body>

                       

                       

                       

                       

                      </html>

                       

                      ...Your main problem was you spelled "placeholderDiv" incorrectly in one place. Once I fixed it, everything worked (pointing at my own viz and remote javascript files, btw). You also had references to stuff you aren't using. I removed those, too.

                       

                      Are you familiar with the FireFox browser and the FireBug plugin? It's really good for troubleshooting JavaScript code. The error message was there, you just needed FireBug to see it...

                       

                      Have fun!

                      • 9. Re: Tableau 8 javascript API
                        Ioana Filipescu

                        Thank you very much. It's embarrassing, such a stupid mistake i couldn't notice a whole day, one misspell.

                        I do am using FF and  Firebug but i haven't debuged javascript with it before. I will look into it.

                        Thanks for helping. Really appreciated.