Skip to main content
Version: 9.5

Heatmap

Heatmap visualizations represent data by mapping ranges of values to ranges of colors. In the heatmap, you select colors to display higher data values as "hot" and lower values as "cold". Qrvey heatmaps use a matrix layout to display one value at the intersection of two dimensions.

Required Columns​

Heatmaps require two dimensions and one measure.

Two categorical data columns are usually used for the dimensions, added to the Category shelf and Pivot shelf. If you use a numeric value column for either of these, Qrvey buckets the data rather than using the distinct numeric data values.

Using date columns as dimensions is very common. Date type columns are grouped by month and year automatically, but you can change the date grouping from the options (three-dot) menu of the column pill in the shelf.

The data fields can also be dragged directly onto the canvas and dropped onto the left or bottom areas. The measure is usually picked from the value data columns and is placed in the Values shelf and aggregated as needed.

Usage​

Heatmaps are best suited for cases when you need to identify anomalies in a value that depends on two dimensions of data. For example, you can represent sales (the measure) of various types of wine (one dimension) produced in different countries (other dimension). This data has been charted in the following heatmap. The contrasting colors of the two cells make the US pinot noir and the French Gewürztraminer stand out.

heatmap

Create a Heatmap Chart​

  1. Select the Heatmap chart type from the charts panel.

  2. Select a dataset.

  3. Determine the measure and the dimensions to map, then drag the measure to the Values shelf and select an aggregate that suits your analytical needs from the three-dot menu.

  4. Drag the category column that represents one dimension onto the Category shelf, then drag the other onto the Pivot shelf.

    While you can select either dimension for shelves, selecting a column with fewer distinct values for the Pivot produces a narrower, easier-to-read chart. When the chart renders, you can then apply styles.

Use Case​

The following example shows which Product Lines are more popular in each Country. Product Line has been chosen for Pivot and Country for Category. To measure popularity, you can use the number of items that were ordered, stored in the quantityOrdered data column. Select a gradient color spectrum rather than a random one to reflect the sequential nature of the numbers in the heatmap. Reverse the order to assign lighter colors to lower numbers and darker colors to higher numbers.

The resulting heatmap reveals the following:

heatmap

  • Most orders are from the US, regardless of the product line (the entire row for the US is darker than the rest of the chart).
  • Classic Cars are the most popular product line, followed closely by Vintage Cars (these are the two darkest cells).
  • Spaniards have roughly the same preference in products as Americans (two product lines are darker than the rest in Spain).
  • The French also like Classic Cars most, but they prefer Motorcycles to Vintage Cars (darker cells in France).
  • Switzerland displays a low order volume, limited to the Classic Cars line. Consider increasing the marketing budget for that country.

Style the Heatmap​

In the Configuration Panel on the right of the Chart Builder, you can style different aspects of your chart.

General​

The General section is available for all chart types, and the options vary depending on the chart selected.

Styles​

Use the Styles section to control visual elements such as colors and labels. This chart type supports the following specific options.

  • Theme - Select a predetermined theme for shading your regions. In most cases, a gradient spectrum is recommended so the color range reflects the range of values. You can also create your own.

    heatmap

  • X-axis (pivot)

    • Axis Title - Give the axis a custom label.
    • Label Rotation - Select the label rotation angle for enabled values.

  • Y-axis

    • Axis Title - Give the axis a custom label.
    • Label Rotation - Select the label rotation angle for enabled values.

  • Custom Scale - By default, a heatmap divides the range of data equally into five colored buckets. You can change the range of displayed data setting the lower and upper limits. You can select the number of buckets in the range by defining Color Steps.

    • Color Steps - Number of different colors used in the chart.
    • Min Range - Minimum value of the data field to display.
    • Max Range - Maximum value of the data field to display.

  • Reversed Colors - Reverse the sequence of colors applied from the theme.

  • Gaps

    • Horizontal Gap - Gap between columns.
    • Vertical Gap - Gap between rows.

  • Data Labels - Show or hide value labels of your data points.

    • Format - Select the format of the values: Default, Abbreviated, Decimal, Currency, Percentage, Scientific.

  • Offset - By default, the chart is centered within the layout (Auto). To create a manual offset, select Percentage or Pixels, then add numbers to the Left and Top fields.

Sorting​

Use the Sorting panel to control sorting options.

Filters​

You can add filters to your data by expanding the Filters section in the configuration panel or selecting Filters from the toolbar above the canvas. Filters that are created in the Chart Builder are hidden from end users. You cannot edit or interact with these filters in view mode.