Infographics in QlikView Vol. 2

I was wandering around my usual QlikView blogs when I found a post by Rebecca Camper (follow her design blog, INTUIQLIK for stylish ideas!) where she showed some cool data visualizations from Simon Spring, a canadian designer. All of them were easy to the eye, but I found this one especially interesting: Coincidentally, later that day I found this other post in LinkedIn that used infographics to illustrate employee satisfaction. It showed some curious numbers about why people stay in their jobs, reward systems and work-life balance.

So anyway, long story short, inspiration came and here’s the second volume of Infographics in QlikView. As you remember, in our last tutorial I showed you how to use bar / block charts, images with transparency and layers to create something like this:
Today, we’re going to work with pivot tables and some images to create these:

 

Tutorial

As always, you can download the ZIP package that contains the QVW, images and data sources needed to create all the objects shown above.

1.- First, we will create a pivot table with two calculated dimensions (same expression for both):

2.- Add the following expression:

3.- Expand the whole table. Drag and drop the second dimension to the top border in order to create a cross table.

4.- As you can see, we have created a matrix that goes from 1 to 100 (I’m sure you now know where this is headed). Change the current expression for this one:

We’re comparing every cell value against an expression and assigning an image in response. In this case my calculation represents the employee turnover of the company. If you’re using a percentage, remember to multiply it by 100

5.- In the Expressions tab, go to Display Options. Select Representation: Image and Image Formatting: Keep Aspect.

6.- The chart is now fully functional, but it may need some extra formatting.

7.- Remove the caption

8.- Remove the borders

9.- In the Presentation tab, select Wrap cell text > 2 lines

10.- In the Style tab remove the vertical cell borders (dimension and expression). Also, set both transparency bars to 100%.

11.- Your chart should look like this:

12.- In order to hide those numbers, activate the design grid (CRTL + G) and in the menu, select Custom Format Cell. (This option may not be available if you don’t activate the design grid).

13.- Set the Text color to white or transparent and apply the change for all the dimensions and expressions.

14.- Adjust the column width and include some icons and text objects.

Voilà! Infographic created. You can also simplify this chart by removing one of the dimensions to create a single row instead of a matrix. Some detail may be lost, but it is a smaller object.

Well, I hope you liked today’s post. Any suggestions or ideas? Leave a comment in the section below!

• Tips & Tricks
• Visualization