dashboard / FOR EVERYONE / LEARN / Tableau

Building impossible things in Tableau

2017-06-15

Did you take part in the ‘Tableau On Tour London’ conference and did you see @tfoldi’s presentation? If so then you know that nothing is impossible in Tableau.

If you had missed it, now here is the chance for you to recap!

Have you ever dreamt of opening your customers’ contracts within a Tableau report, refreshing dashboards’ data directly in Vizportal, introducing your company’s information through stunning chart types or being able to export more sheets simultaneously into excel? I think you wouldn’t ignore if Snoop Dogg shared the details of your meeting in Las Vegas on a chat embedded into Tableau. The POP profession is just like that.

Our CTO, @tfoldi had a visionary idea and we made it real.

The REGGAE TEAM

One day @tfoldi announced he would like to make a presentation in the ‘Tableau On Tour London’ conference. He briefly introduced his ideas.

  1. Auto Refresh
  2. Encrypted PDF
  3. D3 brush filter
  4. Custom D3.js chart
  5. Tabchat 2.0
  6. Tableau JS API Call Examples
  7. Underlying data crosstab

For presenting these functions the BOSS MAN REGGAE AGENCY report has been made

Where did the idea come from? If you know @tfoldi‘s reggae style the topic wouldn’t surprise you. Honestly, until that day I just knew Bob Marley but today I know Haile Selassie’s whole life story.

“Do the Reggay” – The Maytals

To make the report first we needed data. In this matter, I was given a hand by the latest intern at Straschema’s DataViz team – the insolently smart – @István. After compiling the list of fictional albums and bands, a random model for generating sales data was used. This model gives account to the distribution of album release dates through time, gives an estimation of real-life sales trends by gamma distributions, accounts for daytime-nighttime fluctuations, as well as possible differences in band and album popularity.

Let’s create the dashboard, of course just following Jamaican rhythm.

Design:

’It should be nice and black’ – @tfoldi

In the creation of the reports and brainstorming part my team leader who is my colleague at the same time  – @Misi –  played the most important role. I can say thank you to him for making me love my job so much. As the style of the reggae has it’s own colors, the color palette was no question for us. Contrasting colors were necessary to be chosen which gave us a nice contrast with the background. While making the report the main aspect was being able to show the functions.

  1. Auto Refresh your Tableau Dashboard without embedding

If you have read @Norbi’s first masterpiece of Tableau then I am sure you have already used it. If not you can keep up with it here:

http://databoss.starschema.net/auto-refresh-tableau-dashboard-without-embedding/

Briefly, what the counter is capable of: the settled number of seconds in the autoRefresh_seconds parameter calls the refreshDataAsync API call to reload the data behind the dashboard before starting a new count down.

We immediately can see the changes in the profits and in the unit sales of the albums every 10 secs.

  1. Encrypted contracts

Thanks to @Norbi’s  work which offers a key for many we can simply and safely have a look at the documentation on the individual contracts in Tableau.

First, you need to encrypt the PDF then you need to store the given key with the necessary columns in a database. In this case we used PostgresSQl database and we connected to data through ODBC. Why was it necessary? Because it was the only way how we could import the whole field without truncation into the report. It was very important as we would need the whole key during the decrypt process.

For detailed technical information please feel free to contact @Norbi.

  1. Using D3-brush to filter your Tableau dashboard

Can you remember for Chris DeMartini and @tfoldi‘s common project about how a D3 brush is able to filter a Tableau report?

http://www.datablick.com/blog/2017/3/2/building-towards-d3js-plugins-for-tableau

Based on this our fellow colleauge, @Abo made D3 trend visualization which is able to filter the whole dashboard.

 

  1. Custom D3.js chart

The radar chart is depicting Pinky Hunter and other bands’ popularity – meaning the sales of albums – is based on @Abo’s code.

As you know Tableau has no spider chart by default. But there are some cases when it could be very useful D3.js however has a very good support for such visualization. The chart shows data between 0 and 1. So we had to aggregate some data, to show them correctly. The trick we used was to divide the actual value with the max value of the dataset, this way we got a percentage value, which is now could be on the axis of the spider chart.

And basically, that’s all.

 

Seeing this graph I think would also make you grab a Vinyl and put on a good Caribbean music.

  1. Tabchat 2.0 –  REGGAE HOTLINE 0-24

TabChat is a web socket based chat platform for Tableau dashboards. It is designed to allow users to discuss with each other while viewing or analyzing a dashboard. The program has the main component. One is the server side program. (server.js). The other is the client side component (index.html).

 

Future Features – Tabchat 2.0

-send selected marks/filters

-display received marks/filters

-parse date and time from messages, and filter to them

Nothing else is left just to wait for Snoop Dogg gets in touch you, too.

 

 

 

 

 

 

 

 

 

 

 

  1. Underlying data crosstab

Have you ever thought how good it would be if you could export data straight away from the chosen sheet into Excel? @Gyula alias Brick – Starschema’s biggest Javascript guru – has already made this dream come true.

 

  1. Tableau JS API Call Examples

Last but not least we show how to use 3 basic functionality of the JSApi. (Underlying data; Selected data; Get filters)

The basic concept: http://databoss.starschema.net/tableau-javascript-api-without-embedding/

Everybody knows how to add a website view to any dashboards.

Not everyone knows that from this website view we can reach the properties of visualization. This little demo file does this exactly. First things first, we created a little library to reach the properties of the visualization. (tableauLib.js) In this example we will only use the getCurrentWorksheet() method, to get our current worksheet.

The HTML part of it is very simple. Just a headline, 3 buttons, and 3 tables. Bootstrap will do the CSS part. The javascript part of this example is also not too complicated. We have to implement 3 click event listeners, for each button, we have to get the current worksheet with the getCurrentWorksheet() method, and use 2 Tableau JSApi functions (getUnderlyingDataAsync(), getFiltersAsync()).Basically, that’s all. The only thing we have to do after is to handle the function responses. We build an HTML table from them, but you can do whatever you want to do 😉

You can reach @tfoldi’s presentation and the sample source codes ‘ link here:

http://databoss.starschema.net/pushing-limits-tableau-server-practical-lessons-zen-master/

 

Do you have any other unfulfilled dreams? If so don’t hesitate to contact us and we will it come true.

See you next time in LAS VEGAS.  The reggaeness will just grow.

 

@IvettAlexa

4 likes

Author

Ivett Kovács

I love taking datasets into beautiful and informative visualizations. Besides data, I am also very passionate about traveling, surfing, cooking and exploring the outdoors with my dog.

Your email address will not be published.