Heatmap

A heatmap represents values with color. In a grid heatmap, each cell sits at the intersection of two categories, such as day and time of day. A color scale explains how the cell colors map to values.

Support tickets by day and timeSample data

Loading chart…

View sample data

What the example shows

Each cell counts support tickets in one time period. Monday morning has 24 tickets, the largest count. Evenings have fewer tickets across all five days.

The same scale applies to every cell. If each row used its own scale, the colors would show relative intensity within a row, not comparable counts across the chart.

Choose a meaningful color scale

Use a sequential scale for values that run from low to high. Use a diverging scale when values fall on either side of a meaningful midpoint, such as zero change.

Give missing data a separate treatment from zero. A blank cell could otherwise mean no tickets, no measurement, or a failed data import.

Grid heatmaps and other forms

A correlation heatmap shows the relationship between pairs of variables. A website click heatmap places activity over a page image. Both use color for values, but their axes and interpretation differ from this grid example.

Keep labels readable and provide numbers or a table as an alternative to color. For precise comparisons between a few categories, a bar chart is often easier to read. For individual pairs of measurements, use a scatter plot.