> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hubspotcards.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Chart

> Turn a list from HubSpot associations or a connected system into a bar or line chart.

# Chart

**Chart** visualizes rows from a data source as a bar or line chart. Use it for comparisons or trends over time when the data already exists as a list.

## Availability

Chart can be used in all four placements. Keep the number of categories low in the sidebar.

## Add and configure

1. Add **Chart** from **CRM data**.
2. Choose the **Chart type**: bar or line.
3. Choose the **Data source (list)**.
4. Choose the **Category (X axis)**.
5. Choose the **Value (Y axis)**.
6. Optionally choose **Split by**.
7. On a bar chart with a series, you can enable **Stack the bars**.

When the data source changes, Card Studio automatically picks a category and a numeric-looking field. Fields containing `amount`, `total`, `sum`, or `count` are preferred for the Y axis.

## Data requirements

The source must be a list from associated records or a connected system. The Y field must be interpretable as a number. The X axis is created as a category axis in the current designer; the schema can also describe date and linear axes, but the type cannot be changed separately in the UI.

**Split by** groups rows by the field's value. Stacking is only relevant for bar charts with a series.

## Data, rules, and steps

Choosing an associated list creates the required association automatically. The chart can belong to a step and have a visibility rule.

## Limitations and tips

Titles, legends, tooltips, color lists, data labels, axis labels, and sorting exist in the underlying HubSpot components/schema fields, but are not exposed in the current designer.

Data is shown in the source's order. Sort or limit the data in the source if the order matters. A chart with many categories becomes hard to read; use a table for details.