PlotSet LogoPlotSet
Alle Diagrammtypen

Heatmap Maker

Turn a grid of numbers into a pattern you can see. Upload a row, column and value for each cell, and publish an interactive heatmap you can embed anywhere — free.

Was ist ein Heatmap?

A heatmap is a grid where colour stands in for value. Rows and columns are the two things you are crossing — hours against days, products against regions, variables against themselves — and every cell is shaded by the number where they meet. It exists because a table of four hundred numbers is unreadable and a bar chart of four hundred bars is worse. Colour is a weak encoding for a single value, but it is unmatched at revealing structure across many at once: the busy afternoon, the underperforming region, the block of variables that all move together.

Wann ein Heatmap sinnvoll ist

  • You are crossing two categorical variables

    Day against hour, channel against month, product against store. Two axes of categories and one number at each intersection is exactly the shape a heatmap consumes.

  • The pattern matters more than any single cell

    Where the hot band sits, which row is consistently pale, whether the diagonal stands out. Heatmaps answer shape questions, not lookup questions.

  • You have a correlation matrix

    Variables against themselves with a diverging colour scale is the standard way to read a correlation matrix, and one of the few cases where the chart is genuinely the fastest route to the answer.

  • There is too much data for anything else

    Hundreds of cells fit in a screen-sized grid. No other chart type carries that much data at that density and stays readable.

Wann ein Heatmap nicht passt

  • Readers need the actual numbers

    Nobody decodes a shade back into a value accurately. If the figures will be quoted, print them in the cells or use a table.

  • One axis is continuous time you want to trace

    Following a line across a series of colour blocks is much harder than following a line. If the question is "what is the trend", draw a line chart.

  • The values are nearly identical

    A grid of almost the same colour is a picture of nothing. Check the range before you build; if it is narrow, a heatmap will imply differences that are noise.

  • Your audience may not see colour the same way

    Colour is the entire encoding here, so there is no fallback. Use a perceptually uniform, colour-blind-safe scale, and never red-green.

Heatmap erstellen: Schritt für Schritt

Von der Tabelle zum veröffentlichten Diagramm, Schritt für Schritt.

01

Start from the heatmap template

Open the PlotSet heatmap template. It loads with sample data bound so you can see the three-column shape it expects before you swap in your own.

02

Shape your data as row, column and value

One line per cell: which row, which column, and the number. Missing combinations simply leave a gap, which is often itself informative.

03

Upload or connect your data

Import a CSV or Excel file, paste from a spreadsheet, or connect a Google Sheet so the grid can be refreshed later.

04

Choose the right colour scale

Sequential for a quantity that runs from low to high. Diverging, with a meaningful midpoint, when the story is above or below a baseline. Getting this wrong is the fastest way to mislead with a heatmap.

05

Order the rows and columns deliberately

Alphabetical order hides structure. Sorting by total, or clustering similar rows together, is usually what makes the pattern appear at all.

Starten Sie mit der Heatmap-Vorlage samt Beispieldaten und ersetzen Sie diese durch Ihre eigenen.

Vorlage öffnen

Die Bestandteile eines Heatmap

Cell
One intersection of a row and a column, shaded by its value. The unit of the chart, and the thing a tooltip should always explain.
Row and column labels
The two categorical axes. Their order is a design decision, not a given, and it does more for legibility than any colour choice.
Colour scale
The mapping from number to shade. Sequential runs light to dark; diverging runs from one hue through a neutral midpoint to another.
Legend
The only way a reader can convert a shade back into a number. A heatmap without one is decorative.
Scale range
Where the colour scale starts and stops. Clipping it exaggerates differences; letting one outlier set the maximum flattens everything else into a single tone.
Missing cell
A combination with no data. Give it its own visible treatment so it does not read as a low value.

Häufige Fehler bei einem Heatmap

A rainbow colour scale

Spectral scales are not perceptually ordered, so readers see boundaries where the data is smooth. Use a single-hue or a proper diverging scale.

Letting one outlier set the range

A single extreme value pushes every other cell into the bottom of the scale and the grid goes flat. Cap the scale, or transform the values, and say which you did.

Alphabetical rows

Ordering by name scatters similar rows across the grid and hides the structure the chart exists to show. Sort by value or cluster.

Red-green for good and bad

The most common pairing is also the least accessible. Blue-orange carries the same meaning and survives the most common forms of colour blindness.

Heatmap: häufige Fragen

Showing the value of one number across two categorical dimensions at once — days against hours, products against regions, or variables against themselves in a correlation matrix.

Erstellen Sie jetzt Ihr Heatmap

Kostenlos starten mit über 300 Vorlagen. Keine Kreditkarte nötig.