Tableau JavaScript API Help

Important changes for the Tableau JavaScript API
As of February 2024, the Tableau JavaScript API is deprecated. Use the Embedding API v3 instead for embedding interactive views into web pages and applications. The Embedding API v3 improves upon the previous library by offering features you expect for modern JavaScript development, including support for ES6 modules, web components, and availability as an NPM package. For guidance on embedding Tableau views, see the Tableau Embedding API v3 Help(Link opens in a new window). For information about switching from an older version of the Embedding API, see Upgrade from Tableau JavaScript API v1 and v2(Link opens in a new window).

You can embed interactive Tableau views into web pages, blogs, wiki pages, web applications, and intranet portals. Embedded views update as the underlying data changes, or as their workbooks are updated on Tableau Server or Tableau Cloud.

Use the Tableau JavaScript API to integrate Tableau visualizations into your own web applications.

Here are some of the things that you can do with the JavaScript API:

• Display visualizations from Tableau Server, Tableau Public, and Tableau Cloud in web pages.
• Dynamically load and resize visualizations.
• Filter the data displayed in visualizations with HTML controls in the page.
• Select marks in visualizations.
• Respond to events in visualizations.
• Export visualizations to an image or PDF file.

For information on the latest features of the JavaScript API, see What's New in the JavaScript API.

Get Started

1. Create a web page and include the JavaScript API file from the Tableau Server that hosts your visualizations:

   <script src="https://YOUR-SERVER/javascripts/api/tableau-2.min.js"></script>

2. Create a div element in the page body where you want to insert the Tableau visualization:

   <div id="vizContainer"></div>

3. Write a function in a JavaScript file to display the visualization:

   function initViz() {
       var containerDiv = document.getElementById("vizContainer"),
       url = "https://YOUR-SERVER/views/YOUR-VISUALIZATION";
   
       var viz = new tableau.Viz(containerDiv, url);
   }

4. Call the function when the page is done loading:

   initViz();

   The result is below. To view the full code sample, see Basic Embed.