Data Viz Done Right

October 1, 2018

Workout Wednesday: Vertical Label and 3 Mark Types

No comments
For Workout Wednesday week 39, Rody challenged the Community to create a shaded area chart with a line on top and marks for each month. That's three mark types, but Tableau only supports two at a time. In addition, the axis label has to be vertically aligned, that is, each letter in the word has to be below the preceding word.

I was expecting some crazy polygon calculations from Rody, and perhaps that's how he approached it. I, however, was able to create the required view with only two marks and the text shelf. Before I get to how I came up with my solution, here's my submission:


For the dashboard layout:

  1. I used a vertical container with a 50px blank on each side. 
  2. The rest of the viz is in a horizontal container in the middle of the vertical container.
  3. I added spacing to the outside edges of the black line to get the spacing right.
  4. I added some spacing at the top of the parameter and the dynamic title.
  5. The parameter is in a horizontal container with a blank on either side set to distribute evenly.

For the chart:
  1. I used an area chart on one axis.
  2. I used a line chart on the other axis.
  3. I used an ascii ● as a label on each mark on the line. This has to be centered vertically and horizontally for it to appear in the correct place for each month.
  4. For the vertical label, I used this knowledge base article to add a line break after each letter. Since there are 8 letters max, my formula has 8 lines and then I trim the text.



I'm sure there's a better way to do the vertical labels using the length of the string, but this works. In programming, I'd use a WHILE loop. Thanks Rody!

No comments

Post a Comment