# Charts

A Charts layout turns the View's rows into a dashboard of cards, each
counting or aggregating the rows its own way. It only reads: editing stays
with the other layout types. Choose **Charts** as the layout's **Type**; the
sections below follow the layout's **Data** section, which
[Data Filtering](/docs/view/views/data-filtering.md) describes. Every card works
on all rows the filters match, from any data source.

## Layout

**Minimum column width**, 180 to 720 pixels and 320 by default, sets how
narrow a dashboard column may get. Wider values give fewer, roomier columns.

## Chart cards

**Add chart card** adds a card; each card is one entry in the list, with
arrows to move it and **Remove chart card** to delete it. A card has these
settings:

- **Title**, shown at the top of the card.
- **Chart type**: **Area**, **Bar**, **Line**, **Pie**, **Radar**, **Radial**
  or **Number**. A Number card shows one value for all rows.
- **Variant**, the presentation of the chart type, listed below.
- **Group by column**: the column whose values become the chart's
  categories, such as a status column for one bar per status.
- **Series column**, for Area, Bar, Line and Radar charts: an optional second
  column that splits each category into series, such as months grouped by
  status.
- **Aggregation**: **Count** counts rows; **Sum**, **Average**, **Minimum**
  and **Maximum** work on the numbers in **Value column**.
- **Color**: **Blue**, **Green**, **Amber**, **Pink** or **Violet**. Charts
  with several series or slices take further colors from the same palette.
- **Card size**: **Auto** follows the grid, **Standard** takes one column,
  **Wide** spans more and **Full width** spans the whole dashboard.

A Number card has only its title, type, aggregation, value column and card
size.

### Variants

| Chart type | Variants                                                           |
| ---------- | ------------------------------------------------------------------ |
| Area       | Default, Linear, Step, Gradient, Stacked, Stacked expanded, Axes   |
| Bar        | Default, Horizontal, Stacked, Label                                |
| Line       | Default, Linear, Step, Dots, Label                                 |
| Pie        | Simple, Label, Label list, Legend, Donut, Donut active, Donut text |
| Radar      | Default, Dots, Lines, Grid, No grid, Multiple                      |
| Radial     | Simple, Label, Grid, Text, Shape, Stacked                          |

### Display settings

Every chart type except Number has **Show tooltip**, **Tooltip indicator**
(**Dot**, **Line**, **Dashed** or **None**), **Show legend** and **Show
labels**. The rest depend on the chart type:

| Setting                                                                              | Chart types       |
| ------------------------------------------------------------------------------------ | ----------------- |
| **Show grid**, **Show X axis**, **Show Y axis**                                      | Area, Bar, Line   |
| **Curve type**: **Smooth**, **Linear**, **Step** or **Natural**                      | Area, Line        |
| **Stacking**: **None**, **Stacked** or **Expanded**                                  | Area, Bar         |
| **Orientation** (**Vertical** or **Horizontal**), **Bar radius (px)**                | Bar               |
| **Show gradient**                                                                    | Area              |
| **Show fill**                                                                        | Area, Radar       |
| **Fill opacity**                                                                     | Area, Radar       |
| **Stroke width (px)**                                                                | Area, Line, Radar |
| **Show dots**                                                                        | Line, Radar       |
| **Show grid**, **Show radius axis**                                                  | Radar, Radial     |
| **Show angle axis**                                                                  | Radar             |
| **Inner radius (px)**, **Outer radius (px)**, **Start angle (°)**, **End angle (°)** | Pie, Radial       |
| **Padding angle (°)**                                                                | Pie               |
| **Corner radius (px)**, **Show center text**                                         | Radial            |

Raise **Inner radius (px)** above zero for a donut.

## Conditions and delete

The layout's **Conditions** decide who sees its tab; see
[Conditions](/docs/view/views/conditions.md). **Delete layout** removes the
layout when you save the View.
