Animate your Tableau dashboards on the Web

- select the contributor at the end of the page -

In the latest installment of our Tableau Data Series, you'll learn how to animate your Tableau dashboards on the Web. This will require basic understanding of Tableau -- basic HTML and Javascript knowledge will also be helpful.  

Background

Tableau dashboard developers have long wanted to show how things change over time in their views. In Tableau desktop this is possible using the Pages shelf and clicking the play button. The problem however, is that this functionality does not work on Tableau Server or Tableau Public...that is, until now.

Prerequisites

  1. Tableau workbook that can be modified by changing a filter or parameter value
  2. Tableau Server or account on Tableau Public
  3. Web Server to host animated viz (optional)

Setup

  1. Make sure your viz will look good when the parameter value is changed. (I’m saying parameter, but it could also be just a field in your data set that is being used in your viz).
  2. Publish your viz to Tableau Server or Tableau Public. Keep in mind that anything on Tableau Public can be viewed by anyone, so be careful when publishing sensitive data.
  3. Copy animate.html from here (html) to your Web server
  4. Inside animate.html, add your URLs to the locations array starting at line 25 (examples included in html)
  5. Publish your animate.html to a Web server of your choice. You may also fork this repository and use github’s pages as a free hosting of sorts.
  6. Browse to your new animated map, tweak any settings that might not be right, like the time spent on each viz (setInterval parameter in animate.html).

We offer plenty of Tableau training on topwallpaper, in addition to our series of tips and tricks. In case you missed out on some of our earlier posts in the series, you can catch up here:

Examples

  Enjoy!

Get our content first. In your inbox.

Contributor

Ben Sullins

Data Geek