Online tableau training, tableau tips, & video tutorials
How to Make Indicators with Custom Shape Palettes in TableauPreview
Make engaging explanatory dashboard elements with any images
Learn how to create custom shape palettes in Tableau and how to write a calculated field that dynamically displays custom shapes based on performance thresholds. This allows you to create custom indicators with any images of your choosing!
Hi, this is Ryan with Playfair Data TV. In this video, I’m going to show you how to map custom shapes to indicators to visualize whether a period over period change was good, OK, or bad. It’s a nice explanatory visual.
To show you what I’m talking about, take a look at the screen here. I’ve got five KPIs. And this is just meant to be a very high-level, explanatory view to give my user a starting point for an analysis. If the period over period change was greater than 10% in the wrong direction– so we underperformed by at least 10%– the character will turn red with a frown face.
If the period over period change was positive, it turns green with a smiley face. And if we were within 10% but we are down just a little bit, I’m defining that as OK. The character turns yellow with kind of a stoic face. That’s what I’m going to show you how to make with one KPI over here in a new file, using the Sample-Superstore dataset.
The first thing that you need to do is create your period over period change. As I often do here at Playfair Data TV, to simplify the calculation, I’ve simply set up two parameters. They have a data type of Integer, and they run from 1 to 12. So that just accounts for each of the 12 potential months that are available to us.
I’ve done that for both the current month and the comparison month. Again, I want to be clear that I’m very much simplifying this calculation. Because these months, if I choose March, for example, is going to roll up all four years, all four Marches in the sample dataset, and pretend that they’re one.
So just work with me. You will have to make this calculation a little bit trickier if you’re truly wanting to do a month over month comparison. But for the purposes of our illustration, I’ll call this Month over Month Sales.
And the formula would be SUM, open parentheses, IF MONTH of Order Date equals that Current Month parameter, then Sales END. So that isolates, on that top row, sales for the month of March. I then would go down to the next line, put in my operator, and divide March sales by February sales. So IF MONTH of Order Date– left off a bracket there– equals my Comparison Month parameter, then Sales END.
And then you should always do a minus 1 if you’re wanting to do a percentage change. So that’s Month over Month Sales. I will share this in the related content below the video in case that’s helpful to you. Or if your business really does only have one year of data, this would work just fine.
I’ll click OK. Because it is a new calculated field, I’m going to go ahead and set its default properties to Percentage. Otherwise, it just has automatic formatting, without the percent sign and with no decimal places. And now we’ll click OK.
And now we just need one more calculated field that sets up our definition of what it means to be either good, OK, or bad. It’s going to be based on that first formula. So as a shortcut, you could right-click directly on it, hover over Create, and click Calculated Field. That just saves you a few keystrokes. And it puts that first calculated field right into the calculated field dialog, so you can type in the rest of your logic around it.
I’m going to cheat a little bit on this one and just copy and paste in the formula. But I’ll kind of explain what this is doing. Tableau never likes when you copy and paste quotation marks. So bear with me while I fix that. And this is going to be called my Period over Period Indicator Score. Why don’t we just call it Indicator Score for now?
All right, so like I said, it’s looking at that first calculated field. When that March over February sales amount was positive, we’re going to define that as ‘Good’. ELSEIF that period over period sales amount was greater than negative .1.
What that means is the change was negative, so less than 0, but greater than negative .1, which would be a 10% change. When that is the case, we’re going to define that as ‘OK’. Otherwise, there’s only one other potential outcome. If it wasn’t positive or greater than negative 0.1, it must be less than negative 0.1– in other words, a negative change greater than 10%.
With this IF-THEN logic, it’s going to, by default, do the logic at the visualization level of detail. And this logic goes in order, and you can only be classified as one thing at a time. So the reason that this works is because of its order of operations. It’s going to look to see if the change was positive.
That’s the first outcome. When that’s the case, we’re going to call that ‘Good’. It moves on to the next one to see if the change, even though it was negative, is it a greater than negative 0.1 change? That would be ‘OK’. Otherwise, everything else is going to be classified as ‘Bad’. I will click OK.
And I’m going to change the mark type on this view to Shape, and drag that Indicator Score onto the Shape Marks card. And we see a shape show up. We also see an indicator on the shape legend that says ‘Good’. So March over February must have been a positive change. We’ll quality check that in a minute.
But one other note on this type of calculated field that gets a lot of people tripped up– note that Indicator Score had three outcomes, and they were all qualitative– Good, OK, or Bad. The data type is even String, which is what that icon next to the calculated field is telling me. So you might be thinking that that should be a dimension because it’s qualitative.
Well, the reason that that will show up down there as a measure will happen if you’re using a calculated field, where, even though the outcomes are qualitative, if the outcomes are dynamic– in other words, they will change. As I change my months, the scoring will change from Good, OK, to Bad.
When that is the case, it will show up under measures. If the result was always static– so if we were doing a row-level calculated field, as described on the video An Introduction to Tableau Calculated Fields— you would see that calculated field show up as a dimension. So just pointing that out in case it confused you, that will also help you find the calculated fields that you’re looking for.
But back to the process of creating this– March over February must be ‘Good’. What we’re going to do now is map a different indicator shape to each of the three outcomes. To create custom shapes and map them to outcomes within Tableau Desktop, you have to add the shapes to a folder that comes with every installation of Tableau called your Tableau Repository.
So I’m on a PC in Windows. And if I go to This PC, Documents, My Tableau Repository, which everyone will have, you will see a folder within your Tableau Repository called Shapes. You’ll see different folders in that Shapes folder. And those will align with the different palettes contained within this dropdown. So you’ll see a folder for each one of those.
You can make these images with whatever software program you are comfortable using, so PowerPoint or Photoshop. But for best results, I recommend that you save the images with a transparent background with a file type of PNG. It’s a little bit easier to do that in Photoshop. But I realize that not everybody has access to that program. So you could also make these in PowerPoint.
But you might be stuck with a white background, so just keep that in mind. But you’ll make an image, one for each of your outcomes, whatever you’re trying to do for your indicator score. Create a new folder within your Tableau Repository within the Shapes folder, and put all of your images into that new folder that you create.
If you’re doing that for the first time and you’re following along on this video, the new folder will not show up until you click Reload Shapes. So note, these are all the default palettes that come with Tableau Desktop. If I click Reload Shapes and go into this dropdown again, there’s my new Indicators palette.
I can now map that Good outcome to that green smiley face. And I can click Apply to preview the change. It looked like it changed there in the background. But I do want to make that smiley face significantly larger.
All right, we’re going to do some quick quality checking next, just to ensure that the March over February change was, in fact, positive. So I’m going to start a new sheet, and I’ll call this my Trend. I’ll put my Sales measure on the Rows Shelf and break it down by– I’ll do discrete month of Order Date, since we’re pretending that we’re going to roll up all four years into one month at a time.
And just glancing at this right away, I can see that March was a significantly large change compared to February. If I were to change the comparison to be, say, March as the current month. Well, let’s see. That’s not a good example. Let’s do February as the current month and January as the prior month.
So February versus January, that’s ‘Bad’, because we went down month over month. Now that there is a Bad outcome in place, I can click on the Shape legend again and go map the Bad shape.
So click the Bad outcome. Click the red face. Click Apply. And now it’s set to Bad. And this is now going to be dynamic. So if I bumped this back to March versus February or March versus January, it turns to Good, because that period over period change was positive.
Let’s take a look. There is a case here where the change looks like it’s within 10%. So we could change that to June versus May. Let me show you what that would look like. And we could map our last outcome, which would be ‘OK’, to that yellow straight face.
However, we got kind of lucky here that all three outcomes existed. That’s not always the case in the real world. So I’m going to show you one other little trick that allows you to map outcomes, even if they don’t yet exist in your dataset. So let me go back to May. Or we’ll do April versus March, which was Bad. And we’ll pretend that there wasn’t a use case within 10%, within a 10% negative change.
All you have to do is go to your original period over period calculated field. Make sure you copy what’s there, because we’re going to undo this in just a second. But for the time being, I’m just going to put in a placeholder that calculates that third and final outcome. So in this case, my month over month sales would be a negative change, but within 10%. MIN minus 0.01 is a negative change of negative 1%.
Just to preview it and make sure my logic is correct, I could click the Apply button. Sure enough, the outcome changes to ‘OK’. I would then go into the Shape palette, pick that final outcome. Map that to OK. Click OK.
Remember that Month over Month Sales is now static. It is stuck as always negative 1%. So I just want to edit that and go paste my original logic over the top of it. So now we’re back to real life, real world scenarios. And we’ve now got all three scenarios within these dialogs.
So if I were to change this to what we started with, March versus February, the change was Good. If we change it to February versus January, that was Bad. The change was more than negative 10%. And if I change it to June versus May, because we mapped the ‘OK’ scenario, we should see the yellow smiley face show up.
And we do. So now we can use this in a real-life scenario. You’d want to do that process, the month over month sales, for each– I shouldn’t even say month over month sales. You want a month over month calculated field for each KPI in your dataset.
Admittedly, this is a very explanatory visualization. It’s just meant to give you a starting point for an analysis. So I’m going to give you one more trick to add some value to this.
Yes, it’s very engaging, but other than just showing you right off the bat what’s good and what’s bad, it’s not super practical or actionable. It’s not giving us much context on how we’re trending. So one last tip for you, if you are going to put a series of these indicators across the top of a dashboard or along the left-side, I suggest that you use the Viz in Tooltip feature to add some context to this view.
We already created that trend to do some quality checking. So now I can integrate it with this indicator by clicking the Tooltip Marks Card. I’ll just erase what’s there. Click the Insert button. Hover over Sheets and choose Trend. Because line graphs typically go in a more horizontal orientation, I’ll bump the maximum width up to 600. I’ll click OK.
And now, if this were on a dashboard, they would see that month over month sales was not only a negative change within 10%, but they could hover over and get an idea of how we are trending. It looks like we had a big spike from February to March. And then we kind of flattened out from April all the way ’til August before we saw an uptick.
If you ever see that the view is too large like that, that has to do with these dimensions. It looks like it doesn’t have enough width to display that, so I’ll bump that up to 900. Let’s take another look. And now that indicator went away that it’s too large. So there is the entire line graph.
This has been Ryan with Playfair Data TV – thanks for watching!
Related video: An Introduction to Tableau Calculated Fields
Related video: How to Show Selections with Button Swapping in Tableau
Related video: 3 Ways to Smooth the Excel Transition
Related blog post: Dashboard Gauge 5 – How to Make Indicators with Custom Shape Palettes
Related chapter: Innovative Tableau – Chapter 89 – How to Make Indicators with Custom Shape Palettes
Calculated field that computes the percentage change between the current month and comparison month:
SUM(IF MONTH([Order Date]) = [Current Month Parameter] THEN [Sales] END)
SUM(IF MONTH([Order Date]) = [Comparison Month Parameter] THEN [Sales] END)
Calculated field that classifies current month vs. comparison month performance as Good, Okay, or Bad:
IF [Change] > 0 THEN “Good”
ELSEIF [Change] > -.1 THEN “Okay”
- Making Your First Tableau Dashboard (Part 1)
- Making Your First Tableau Dashboard (Part 2)
- An Introduction to Tableau Dashboard Actions
- How to Avoid Highlighting Dashboard Action Selections
- How to Use Tableau Parameter Dashboard Actions
- How to Do Pagination in Tableau
- Tableau Dashboard Element: The Current Versus Comparison Callout
- How to Make a Stock Ticker Gauge in Tableau
- How to Create Performance Indicator Titles in Tableau
- Tableau Dashboard Element: The Global Filters Tab
- Tableau Dashboard Element: The Parameterized Scatter Plot
- 3 Ways to Add a Button to a Tableau Dashboard
- How to Make a Navigation Bar with Buttons in Tableau
- How to Add a Filter in Use Alert to a Tableau Dashboard
- How to Highlight a Dimension Member in Tableau
- Exercise: Highlight a Dimension Member Using a Parameter Control
- How to Make Indicators with Custom Shape Palettes in Tableau
- How to Add a Show/Hide Button to a Tableau Layout Container