How to combine a bar chart and a heat map

Many times users lose a great opportunity to use color to make their QlikView interface more appealing and insightful when they choose to make a rainbow-colored bar chart.  One of the most important subjects I had to leave out of Learning QlikView Data Visualization was how to apply the coloring technique of a heat map to a bar chart. In the book, I left the exercise of combining these two data visualization techniques to the reader. In this blog, let’s review how we combine the two by adding data about the profit generated from each customer to a simple bar chart that ranks customers by their net sales.  If you want to follow along with the exercise below, download Sales_Project_Analysis_Sandbox.qvw. Before starting the exercise, let’s review what colors we want to use to represent data in a heat map.  Colorbrewer is a great site to choose color-blind safe colors schemes that are either sequential or diverging.

  • Sequential color scheme – The greater the data value, the darker the shade of one color.
  • Diverging color scheme – The combination of two sequential schemes that are divided at some center point (e.g. zero).  The greater the distance from the center point, the darker the shade of either of the two colors.

Since we will be adding data about profit which can either be positive or negative, we use the diverging color scheme.  Also, we choose orange and blue as the two colors that make up the color scheme in order to ensure the involvement of those of us who are color blind. I’ll assume we’ve already created a simple bar chart that shows the top-selling customers based on net sales like the one pictured below.

9894EN_02_4

In the properties window of our bar chart, let’s perform the following steps.

  1. In the Expressions tab, click the plus sign next to the expression to expand its properties.
  2. Select Background Color and click in the Definition text area to the right.
  3. In the File menu of the Edit Expression window, select Colormix Wizard…
  4. Click Next >.
  5. In the Value Expression text box, type Sum ([Profit Margin]) and click Next >.
  6. In the Upper Limit section, click the green color button twice and then in the Color window select blue (Red=0, Green=128, Blue=255).
  7. Select the Intermediate checkbox and type 0 in the text box below.
  8. In the Intermediate section, click the yellow color button twice and then in the Color window select light gray (Red=192, Green=192, Blue=192)
  9. In the Lower Limit section, click the red color button twice and then in the Color window select orange (Red=255, Green=128, Blue=64)
  10. Click Next >.
  11. Clear the Enhanced Colors checkbox to make extreme values stand out.
  12. Click Finish.

After adding adequate labeling and accepting the changes made in the chart properties window, we now have the following chart that is both appealing and insightful.

9894EN_02_5

Here’s the video tutorial.

Hope to see you around, Karl

Author: Karl Pover

Owner of Evolution Consulting, which provides Qlik consulting services throughout Mexico. Author of "Learning QlikView Data Visualization" and "Mastering QlikView Data Visualization." Qlik Luminary since 2014.

Leave a Reply