# Stacked Bar Charts

Stacked bar charts break down and compare parts of a whole across different categories by stacking bars. Each bar shows the total, while segments within the bar show the composition of that total.

## When to use Stacked Bar Charts

Stacked bar charts are ideal when you want to:

* Show part-to-whole relationships across categories
* Compare both total values AND their composition
* Display how different components contribute to a total
* Track changes in composition over time

## Configuring Your Stacked Bar Chart

### Setting the X-Axis

The X-Axis represents your main categories or time periods that you want to compare:

**Best practices for X-Axis:**

* **Date fields for time periods**: Select a date field (like "Created Date" or "Order Date"), then group by Month, Quarter, or Year (to show composition changes over time)
* **Categories**: Department, Region, Product Line
* **Groups**: Customer Type, Project Phase, Priority Level

{% hint style="info" %}
**Using date fields:** Select an actual date field (like "Created Date"), then choose how to group the dates: **Year**, **Quarter**, or **Month**. Noloco automatically sorts dates chronologically (oldest to newest, left to right). You don't need a separate "Month" or "Year" field in your data.
{% endhint %}

**Example:** For showing ticket composition by month, set your X-Axis to "Created Date" and group by "Month".

### Adding Series (Y-Axis Values)

In stacked bar charts, each series becomes a segment within the bar. All series stack on top of each other to show the total.

**Key concept**: Each series typically represents a different category or type that makes up your total. For example:

* Different product types contributing to total sales
* Different ticket statuses making up total tickets
* Different expense categories in total spending

**For each series, you'll configure:**

1. **Y-Axis Value**: The numeric field to measure
2. **Aggregation Method**: How to calculate each segment
   * **Sum**: Total value for this segment
   * **Count**: Number of records in this segment
   * **Average**: Mean value for this segment
3. **Series Label**: Name of this component/segment
4. **Filter** (important!): Filter each series to only show the specific category it represents

### Example Configuration

**Scenario**: Show support tickets by status across months

**X-Axis Configuration:**

* Field: `Created Date`
* Group by: `Month`

**Series 1:**

* Label: "Open"
* Y-Axis Value: (Record count)
* Aggregation: `Count`
* Filter: Status equals "Open"

**Series 2:**

* Label: "In Progress"
* Y-Axis Value: (Record count)
* Aggregation: `Count`
* Filter: Status equals "In Progress"

**Series 3:**

* Label: "Closed"
* Y-Axis Value: (Record count)
* Aggregation: `Count`
* Filter: Status equals "Closed"

This creates a stacked bar chart where each month's bar shows the total tickets, broken down by status.

## How Series Filters Work

The key to stacked bar charts is using filters on each series:

1. Each series shows data from the same table
2. Apply a filter to each series to isolate a specific category
3. The filters should be mutually exclusive (no overlap)
4. Together, all series should represent the complete dataset

**Example Pattern:**

* Series 1 Filter: `Priority = "High"`
* Series 2 Filter: `Priority = "Medium"`
* Series 3 Filter: `Priority = "Low"`

## Common Use Cases

### Sales Composition by Product Category

* **X-Axis**: Order Date (grouped by Month)
* **Series 1**: Electronics Sales (filtered to Category = "Electronics")
* **Series 2**: Clothing Sales (filtered to Category = "Clothing")
* **Series 3**: Home Goods Sales (filtered to Category = "Home Goods")

### Budget vs. Actual Spending by Department

* **X-Axis**: Department
* **Series 1**: Allocated Budget (Sum of Budget field)
* **Series 2**: Actual Spending (Sum of Spent field)

### Ticket Distribution Over Time

* **X-Axis**: Created Date (grouped by Week)
* **Series**: One for each ticket status (Open, In Progress, Closed, etc.)

### Revenue by Customer Type

* **X-Axis**: Sale Date (grouped by Quarter)
* **Series 1**: Enterprise Revenue (filtered to Type = "Enterprise")
* **Series 2**: SMB Revenue (filtered to Type = "SMB")
* **Series 3**: Individual Revenue (filtered to Type = "Individual")

## Tips for Better Stacked Bar Charts

1. **Limit series count**: 3-6 series work best. Too many segments become hard to read
2. **Use logical ordering**: Stack series in a meaningful order (e.g., sequential stages, priority levels)
3. **Consistent colors**: Keep the same series in the same color position across all bars
4. **Filter properly**: Ensure your series filters don't overlap or leave gaps
5. **Consider alternatives**: If you want to compare totals across categories rather than composition, use a regular bar chart instead
6. **Add context**: Use titles and subtitles to explain what the stacks represent

## 100% Stacked Bar Charts

Some stacked bar charts can show percentages instead of absolute values:

* Useful when you want to compare proportions rather than totals
* All bars reach 100%, showing relative composition
* Great for seeing how the mix changes even if totals vary


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guides.noloco.io/charts/stacked-bar-charts.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.