Accommodating Variable Height in a Text Table in Tableau

(Addendum: Jonathan Drummey has a much better Tableau-only solution that I missed from his presentation. I only caught later part of the presentation. You might ask him about it if you know him.)

In a recent presentation, Tableau visionary HOF Jonathan Drummey talked about a solution for a variable row heights in a text table. The question apparently came from a perfectionist tableau designer. Tableau is not really made for text processing. But for someone visually sensitive, he or we may wish to design a text table beautifully.

Here is what it is about. 

Problem Statement

We assumed that the text has been properly line-broked to accommodate a certain width.

In Tableau we usually have a text table like this:

Note that, when the row heights are equal, it leaves a lot of white spaces. What we want is actually like this:

The row height is variable, removing unnecessary blank spaces.

The Tableau Solution

Jonathan got a solution using Python to preprocess the data. I tried using Tableau only and found a solution that doesn't need extra tools. 

1) First, we can calculate the number of new rows per each Row ID, by counting the number of line breaks. (per Jonathan's courtesy)

2) Secondly, let's perform the self-union of the data source. Note that the data source is in the 'breaks' sheet of an Excel file. In the Tableau data source editor, drag the break sheet to the editor canvas first. Then drag it again to the lower side of the first sheet, an orange rectangle of Drag table to union will appear. Drop the sheet there and we will have a self-unioned data source.

3) After self union of the data source, we rename the data source as "Text table with linebreaks SU". Now we create a new field "Row Index" as follows.

This will help create Index of rows per Row Id, that is, the index for the new rows as inserting line breaks. 

4) Right click "Row Index" and create bins named as "Row Index (bin)"

Using this field "Row Index (bin)", we create a new table with indexes within each Row Id. In the Text String field, the string is the same one per Row Id with multiple line breaks. Note that there are three dots "..." at the end of each string.

5) For technical reasons, we can't use "Row Index (bin)" in our calculations, neither with Index() function based on the bins. (For the curious ones, Tableau's string functions don't accept aggregated fields)

So, to keep the indexes which are absolutely necessary, let's export the data to a .csv file to create a new data source. The new one has a new index field. Note that we are using Tableau to do some data processing and reshaping.

Go to the menu Analysis>View Data which will open the view below. Download the table into a new .csv file. And our data preparation is finally done.

6) Import the new .csv file into Tableau. Rename "Row Index (bin)" as "Row Index". Create a new field "Text Row" as follows.

This formula will extract each of the new rows by line breaks per Row Id. See the table below.

By hiding the Row Index column, we obtain the table with variable row height. We leave it unhide for your understanding.

Voila we just turned a table of equal row height into one of variable row height in Tableau.

Download the above workbook here.

This is one approach to handle text wrapping in a text field. I have written another post before. Tableau doesn't do it well. That's why we have to go through some acrobatics to achieve it.