Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Find everything you need to get certified on Fabric—skills challenges, live sessions, exam prep, role guidance, and more. Get started

Ritaf1983

A Post About Love for Tea, Pies, and Waffles from the Matrix

Let's start with a little riddle.

Let's see how much the Brits love their tea 🙃

What do you think is the percentage of Brits who drink tea regularly?

Ritaf1983_1-1719065954694.png

And now, have you gotten the same answer with the same accuracy, speed, and confidence level?

Ritaf1983_2-1719066281292.png

Why is it more challenging to get an accurate answer from pie/donut charts and why do we feel less confident trying to read them?

 

The main reason is the difficulty in calculating the areas of the pie slices/lengths of the donut arcs.

Ritaf1983_3-1719069188171.png

 

This is much more challenging and less confident than comparing the areas of rectangular shapes.

For those who want to delve deeper, I've also included a link to a very interesting study on the subject.

https://eagereyes.org/blog/2016/a-reanalysis-of-a-study-about-square-pie-charts-from-2009?fbclid=IwA...

 

A well-designed waffle chart with the necessary supporting elements allows for quick and accurate estimation, eliminating the need to calculate areas.

Ritaf1983_2-1719118788194.png

 

Unfortunately, the waffle charts in our arsenal do not achieve the same results as the one shown in the image above.

Ritaf1983_0-1719118091964.png

So, what can we do?


We'll use the magic of the matrix in combination with some DAX and conditional formatting 😉

Ritaf1983_1-1719118331254.png

How will it work?

 

1. We'll create a 10 x 10 table using DAX.

 

Waffle table =
Var X_table =
SELECTCOLUMNS(GENERATESERIES(1,10), "X_axis",[Value])// Creating of X axis
Var Y_table =
SELECTCOLUMNS(GENERATESERIES(1,10), "Y_axis",[Value])//Creating of Y axis
Return
GENERATE(X_table,Y_table)
Ritaf1983_3-1719118901333.png

 

2. In this step, we create a measure that divides our percentage measure (percent_tea, in my case) into tens and units in the first stage.

In the second stage, it scans the matrix we created earlier and fills each selected cell with 1 if the value is greater than 0, and with 0 if there is no value.

 

Tea % =
var Pct = [percent_tea]
var PctProcesed = ROUNDDOWN(Pct/10,0)// tens
var SpillOver = ROUND((Pct/10-PctProcesed)*10,0)//units
Return
If (SELECTEDVALUE('Waffle table'[y_axis])<=PctProcesed,
1,
if(SELECTEDVALUE('Waffle table'[y_axis]) =PctProcesed+1 && SELECTEDVALUE('Waffle table'[X_axis])<=SpillOver,
"1",
"0"
))
Ritaf1983_4-1719119300234.png

 

3. Now we have come to the point where we only have design work left:

a. We will  create a matrix, and choose the design type: None + switch off the totals

Ritaf1983_5-1719121562544.png

 

Ritaf1983_7-1719121636655.png

b. We will define conditional formatting for the background of the cells:

  1. A cell with a value of 1 will receive a highlighted color.
  2. A cell with a value of 0 will receive gray.
    Ritaf1983_8-1719122095896.png

    To Hide the numbers we'll apply the same steps  for the fonts :

    Ritaf1983_9-1719122223179.png
  3. To hide the row and column headers, we will simply set their color to white
    Ritaf1983_10-1719122831286.png

     

  4. To add separation between the waffle squares, we will use matrix gridlines and color them white
    Ritaf1983_0-1719123177994.png

     

  5. To help users read the chart without counting the squares, we will add labels using text boxes.

    I have added labels for the beginning, middle, and end. It is possible to add more labels, for example, every 10%

    Ritaf1983_1-1719124665166.png

     

  6. We are left with the title, which also serves as the legend. Since there is no option to format part of the title of a generic visualization in different colors, we will use a text box here as well.
    Ritaf1983_3-1719124957038.png

     

  7. And finally 🙂 All that's left is to group the entire construction so it stays in place

     

    Ritaf1983_4-1719125026311.png
    Thank you to everyone who made it through the read. Good luck with the implementation!🎓

    The pbix with the example is attached

     

Comments

Nice work. Thanks for sharing 🙂 

@ray_ux 

Thank you very much for reading and the feedback 🙂