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
-
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>
-
Create a
div
element in the pagebody
where you want to insert the Tableau visualization:<div id="vizContainer"></div>
-
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); }
-
Call the function when the page is done loading:
initViz();
The result is below. To view the full code sample, see Basic Embed.