Style Column

Column (v1.3.0+)

Vertical columns over time: energy used per day, rain per hour, hours of heating per day. It is a history chart like Line, and shares its period, calendar spans, previous and next buttons, statistics, axes, hover readout and compact layout.

Good for

Totals and averages per hour, day, week or month, especially from meters that count up (energy, water, gas, rain).

Example

type: custom:chartdeck-card
style: column
title: Energy per day
entities:
  - sensor.house_energy

That's all it needs. With no options the chart shows the last 7 days, one column per day, each showing how much the meter rose that day.

To use this style, set style: column (or pick Column under History charts in the editor's Style section). The chart options are in the editor's Chart section.

Sensible defaults

• Period: the last 7 days when period isn't set.
• Grouping (group_by: auto, the default) picks a size for the span: hours up to two days, days up to two months, then weeks, then months. Today is grouped by hour, a week or a month by day, and a year by month. Set group_by to hour, day, week or month to choose it yourself, or none for one column per reading.
• Combining (aggregate: auto, the default): when every entity is a meter (state_class of total or total_increasing) each column shows how much it rose (change); otherwise it shows the average. Any aggregate from grouping can be set instead.

Options

stack: normal     # none (default), normal or percent
labels: true      # the value on top of each column
rounded: true     # rounded outer ends (default)
range: false      # each column from the group's lowest to its highest
color_by: series  # series (default) or bands

• Several entities sit side by side in each group, unless they are stacked.
• stack: normal piles the entities up into one column; stack: percent scales each column to 100 %. Positive values stack up from zero and negative ones down from it.
• Negative values hang below zero, and the value axis always includes zero (with range, it fits the spread instead).
• labels: true puts each column's value on top (a stack's total). Labels are left off when the columns are too narrow for them, or when there are more than 60.
• rounded rounds each column's outer end. The columns are drawn over the plot rather than inside its stretched drawing, so corners stay round at any width.
• range: true draws each column from the group's lowest reading to its highest, with the average marked across it: a day's temperature spread, for instance. From statistics it asks the recorder for the min and max; from history it takes the spread of the values held in each group.
• color_by: bands colours each column by the colour band its value falls in.
• An entity's target (from the Limits section) is drawn as a line across each of its columns.
• Per entity, color sets the column colour.

When grouped, the time axis puts one label under each group (Mon, Tue… or 26 Oct, or Oct, Nov), every second or third when they wouldn't all fit. The hover readout names the whole group ("26 Oct – 1 Nov") and highlights it.

Error bars (v2.2.0+)

group_by: day
error_bars: std   # none (default), std, min_max or ci95

A whisker over each column shows how the readings inside that group were spread, so a day that swung from 16 to 24 °C looks different from one that held at 20.

error_bars	The whisker runs from… to…
none	No whiskers (the default)
std	The average less one standard deviation, to the average plus one
min_max	The lowest value in the group, to the highest
ci95	The 95 % confidence interval of the average: 1.96 standard deviations divided by the square root of the number of readings, either side

• The spread is weighted by how long each value held, the same way the column's average is. From statistics, min_max uses each row's own lowest and highest.
• A std or ci95 whisker never reaches past the group's lowest or highest reading, so a positive column's whisker never pushes the axis below zero.
• Readings next to each other are not independent, so ci95 comes out narrower than a strict confidence interval. Use it to compare groups with each other.
• The value axis widens to fit the whiskers. The hover readout adds the range: "Living room 20.1 °C (17.9 – 23.4)".

Whiskers are drawn only where they mean something: when readings are grouped (group_by isn't none), side by side or a single series (not stacked), without range: true. std and ci95 need aggregate: mean; min_max works with mean, min, max, first and last. Meters combined with sum or change get no whiskers, since the spread of a meter's readings says nothing. In those cases the chart draws without whiskers rather than refusing the config.

In the editor: Error bars (spread in each column) in the Chart section, shown while readings are grouped.

Now line (v2.2.0+)

period:
  last: 7
  unit: day
group_by: day
now_marker: line   # off (default), line, time or countdown

When the last column is still running (today, on a chart grouped by day), a line marks the present moment inside it and moves once a minute. It works as on the line chart: see Now line. The countdown reads the time annotations in the card's config, though the column chart doesn't draw them.

In the editor: Now line in the Chart section.

Energy dashboard (v2.2.0+)

type: custom:chartdeck-card
style: column
title: Energy, last 24 hours
source: energy
period:
  last: 24
  unit: hour
group_by: hour
stack: normal

source: energy draws the flows set up in Home Assistant's Energy dashboard without listing any entities: grid import and export, solar and battery by default. On a column chart, energy leaving the house (grid export and battery charging) hangs below the axis. Hover readouts, labels and the header still read it as a positive amount, and a stack's total is what came in less what went out. energy_split: false stacks everything upward instead. See source: energy for the flows and the rest.

In the editor: Readings from → Energy dashboard in the Chart section, then Energy flows and Export and battery charging below the axis.

Everything else

The period, calendar spans, source, axes, gridlines, hover and compact layout are the same as on the line chart. See Line for each one.

Layout: one chart for the whole card. Every shared option is described on the Options page.

Previous: Area · Next: Combined · All styles