Hello,

The Waffle Chart is a Power BI visualization that allows you to easily and visually compare data as percentages. One powerful feature of the Waffle Chart is that it supports custom shapes, as can be seen in this video and this other video.

The custom shapes can be anything that can be represented with an SVG path, such as these:

Once you have an SVG file, you can obtain a path by uploading it at http://kiewic.github.io/paths and you will get a list of the paths that make up your SVG image.

Select the path in one of the boxes (there may be only one), copy it, and use it as a string value in your Power BI input file (a CSV file is the easiest):

47,Transit,"M77.619,14.775c-1.098-5.528-4.622-7.731-9.931-9.93C62.499,2.668,50.02,0.079,40.794,0 c-9.243,0.079-21.722,2.668-26.948,4.846c-5.271,2.199-8.795,4.402-9.875,9.93L0,45.284v42.091h6.84v6.564 c-0.027,8.071,11.745,8.071,11.75,0v-6.564h21.737h0.054H63v6.564c-0.014,8.071,11.759,8.071,11.75,0v-6.564h6.84V45.284 L77.619,14.775z M23.996,7.715h16.385h17.212c3.286-0.009,3.286,4.949,0,4.965H40.327H23.996 C20.694,12.664,20.694,7.706,23.996,7.715z M12.687,74.191c-3.101-0.015-5.631-2.542-5.627-5.682 c-0.004-3.099,2.526-5.627,5.627-5.627c3.136,0,5.665,2.528,5.683,5.627C18.352,71.649,15.823,74.177,12.687,74.191z M40.381,48.482H10.426c-2.925,0.028-3.54-2.081-3.253-4.192l3.088-22.177c0.425-2.67,1.336-4.443,4.854-4.468h25.213h26.149 c3.498,0.025,4.412,1.797,4.854,4.468l3.09,22.177c0.266,2.112-0.348,4.22-3.256,4.192H40.381z M68.848,74.191 c-3.1-0.015-5.628-2.542-5.628-5.682c0-3.099,2.528-5.627,5.628-5.627c3.137,0,5.667,2.528,5.681,5.627 C74.515,71.649,71.985,74.177,68.848,74.191z"

Download full CVS file example here.

And that is it.

Live Example

Troubleshooting

The shapes are not centered?

You can get better results by aligning your path to the top left corner. That is something the online tool does not support at this time, but you can align a path using other image editors, such as Adobe Illustrator or Inkscape.

String length limitation in Power BI Web?

Yes, starting February 2016, the string values are limited in the Web client. If the path is very long, it will be truncated. However, this limitation does not exist in the Desktop client.

Is the Waffle Chart open source?

Yes, head to the GitHub repo to get access to the source code.

Is there a shorter example?

Yes, starts and triangles:

Group,Values,Shapes
A,50,"M 0 -1 L 0.588 0.809 -0.951 -0.309 0.951 -0.309 -0.588 0.809 Z"
B,75,"M150 0 L75 200 L225 200 Z"

Credits

Icons in this article were obtained from the AIGA collection created by Edward Boatman. You can also download SVG files from the Noun Project.