---
title: "Column"
description: "A categorical chart visualization for comparing numerical values across discrete categories using vertical columns, with support for grouping, stacking, and percentage display."
group: Charts
tags: [Visualization, Chart, Dashboard, Insights, Comparative Analysis]
---

import { Aside, Steps } from '@astrojs/starlight/components';

# Column

The **Column Chart** is a classic vertical bar chart that represents **numerical values** using the length of vertical columns, plotted along a **Numerical Y-axis**, while the categories are placed on the **X-axis**.  
It supports **grouped, stacked, and percentage-stacked** column layouts, along with single-series colorization for simple comparisons.

This chart type is ideal when visualizing **ranked, segmented, or comparative data sets** on dashboards and analytical reports.

**Use cases:**
- Comparing **monthly sales figures** by **region**.
- Displaying **product revenue** across **product categories**, optionally segmented by **distribution channel**.
- Analyzing **incident counts** by **department**, with a breakdown by **severity**.

<Aside>
Use a **Column Chart** when comparing **numerical data across categorical values**, typically with time or ranked labels on the horizontal axis.  
Avoid for continuous or time-series trends.
</Aside>

---

## ⚙️ Setup

<Steps>
1. Drag the **Column Chart** widget from the chart library onto your designer workspace.
2. Select the chart.
3. Go to the [Widget Configuration](/insights-v8/guide-to-infoboard-designer/customize-panel/configure/) tab in the Configuration panel.
4. Under the Configuration panel tab, select the [Basic Configuration](/insights-v8/guide-to-infoboard-designer/customize-panel/configure/#basic) option to access the essential settings for the Column Chart.
5. Select the [Source](/insights-v8/guide-to-infoboard-designer/customize-panel/setup/#sources) which the chart will pull the data from.
6. Map:
   - **[Measure (Value)](/studio-v8/datasources/measures-dimensions-and-hierarchies/)** — Numeric value determining the height of each column.
   - **[Dimension (Axis)](/studio-v8/datasources/measures-dimensions-and-hierarchies/)** — Categorical value for the X-axis labels.
   - **[Group](/studio-v8/datasources/measures-dimensions-and-hierarchies/)** — Optional dimension to group columns within each category.
7. Optionally add a **Date** field for time-based filtering.
8. Enable **Hide Zero Values** to omit columns with zero value if needed.
</Steps>

---

## 📊 Basic Configuration

| Configuration Item   | Description |
|:---------------------|:-------------|
| **[Source](/insights-v8/guide-to-infoboard-designer/customize-panel/setup/#sources)**        | Source providing the data for measures and dimensions. |
| **[Measure (Value)](/studio-v8/datasources/measures-dimensions-and-hierarchies/)**   | Numeric value represented by the height of each column. |
| **[Dimension (Axis)](/studio-v8/datasources/measures-dimensions-and-hierarchies/)**  | Categorical value for the X-axis labels. |
| **[Group](/studio-v8/datasources/measures-dimensions-and-hierarchies/)**             | Optional — Categorical field for grouping multiple columns per category. |
| **Date Field** (optional) | Date dimension for time-based data filtering. |
| **Hide Zero Values**  | Option to suppress columns with zero value from display. |

<Aside type="danger" title="Don'ts">
* Avoid using for large continuous numeric series.
* Don't overcrowd the X-axis with too many categories.
</Aside>

---

## 🎨 Chart Customizations

| Category                     | Options & Description |
|:----------------------------|:-----------------------------------------------------------|
| **[General](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#general)** | Modify background color, border, shadow, and drill-out behavior. |
| **[Title](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#title)** | Configure chart title, font, alignment, and visibility. |
| **[Sorting](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#sorting)** | Sort categories on the X-axis based on value or custom order. |
| **[Grid](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#grid)** | Adjust margins, spacing, and padding inside the chart grid. |
| **[Legend](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#legends)** | Show/hide, position, and style legends for grouped columns. |
| **[HeatMap](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#heatmap)** | Apply color gradient mapping based on value intensity. |
| **[Categorical Axis (X)](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#categorical-axis)** | Manage category labels, spacing, rotation, and axis sliders. |
| **[Numerical Axis (Y)](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#numerical-axis)** | Control Y-axis scaling (linear/logarithmic), ranges, and labels. |
| **[Series](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#series-customization)** | Style bar fill color, stacking, pattern, and label positions. |
| **[Tooltip](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#tooltip)** | Customize tooltips with formatting, styling, and hover behavior. |
| **Others** | Toggle **Stack**, **Stack as Percentage**, and **Colorize Single Series** features. |

<Aside>
* Enable **Stack** to combine grouped columns into a single stacked column per category.
* Use **Stack as Percentage** to display each group’s value as a percentage of the category total.
* Use **Colorize Single Series** to assign unique colors to each category when Group dimension is absent.
</Aside>

---

## 📊 Example Visualization

![Column chart](/images/Insights/Infoboards/Infoboard-Designer/Chart-Library/column.png)