---
title: Chart Types
slug: user-guide-10x/chart-types
docTags: 
createdAt: 2025-06-18T11:01:38.788Z
---

This topic contains chart type examples.

## Bar Charts

Use bar charts to show comparisons between different categories of data. The bars can display either vertically or horizontally.

### Vertical Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/QhWifJJj_xiDTA2qVfCnJ_vertical-bar-example.png" size="30" width="1018" height="465" position="center" showCaption="false"}

### Grouped Vertical Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/sRC-ZneaWPo1Rd0eT4Jfu_grouped-vertical-bar.png" size="32" width="1014" height="462" position="center" showCaption="false"}

### Stacked Vertical Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/HH6VfTRZHfk8h7nMX1LNz_stacked-vertical-bar.png" size="28" width="1387" height="453" position="center" showCaption="false"}

### 100% Vertical Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/v-_8kAWYGQ5t3aIUmop0d_100-percent-vertical-bar.png" size="36" width="1387" height="459" position="center" showCaption="false"}

### Horizontal Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/S0z5g61ZBSqpoMShiVNwM_horizontal-bar.png" size="38" width="1022" height="460" position="center" showCaption="false"}

### Grouped Horizontal Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/Ht6DvB-mlNbt-qwk8P3nm_grouped-horizontal-bar.png" size="38" width="1374" height="447" position="center" showCaption="false"}

### Stacked Horizontal Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/n6hTaEN7GjNqIdDQZgCBN_stacked-horizontal-bar.png" size="36" width="1385" height="452" position="center" showCaption="false"}

### 100% Horizontal Bar

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/jQBkctxC1jPvdwi_GfitX_100-percent-horizontal-bar.png" size="38" width="1378" height="458" position="center" showCaption="false"}

## Line Charts

Use line charts when you want to represent continuous data in a chart. Line charts work well with time data, but can also be used for other types of continuous data such as levels or distances.

### Line

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/E8d7lrVU4zBXGm3cat7Lg_line-chart.png" size="42" width="1390" height="464" position="center" showCaption="false"}

### Multi-Series Line

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/du_KZzcHzMqSLxRzjvpNx_multi-series-line.png" size="38" width="1380" height="461" position="center" showCaption="false"}

## Radar Charts

Use radar charts to display multivariate data in a two-dimensional format. The variables (3 or more) are typically represented on axes starting from the same point.

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/DQGc_7r0vUWKd-HbCvv4g_radar-chart.png" size="46" width="1383" height="393" position="center" showCaption="false"}

## Area Charts

Area charts are similar to line charts. Use area charts to demonstrate trends over time.

### Area

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/MsBbFAc2pmgLWDRvZxKIy_area-chart.png" size="48" width="1374" height="459" position="center" showCaption="false"}

### Stacked Area

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/SYpp-KZ0vUK8vLIJgRqvd_stacked-area.png" size="42" width="1398" height="458" position="center" showCaption="false"}

### 100% Area

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/2o8dHw9Ajc4saMj0gPW9-_100-percent-area.png" size="54" width="1378" height="450" position="center" showCaption="false"}

## Pie Charts

Use a pie chart when you want to display the composition of something.

### Pie

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/4ZLCS6aERDzn5lOqELn9k_pie-chart.png" size="42" width="1064" height="440" position="center" showCaption="false"}

### Donut

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/ZV12vi68MEu6J-tLlF9Ph_donut-chart.png" size="46" width="1047" height="437" position="center" showCaption="false"}

### Pie Grid

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/1y9nofdAYVH8AwFA7Zb6E_pie-grid.png" size="46" width="1378" height="444" position="center" showCaption="false"}

### Advanced Pie

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/1VlcWdOipJbnC-gRQdlxQ_advanced-pie.png" size="38" width="1092" height="440" position="center" showCaption="false"}

## Number Card

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/Fge3_oEN33JI04zKM6FQx_number-card.png" size="40" width="1374" height="440" position="center" showCaption="false"}

### Heat Map

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/cj7Yji5ax8rheOxc-uZ-x_heat-map.png" size="40" width="728" height="415" position="center" showCaption="false"}

### Linear Gauge

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/qFBC7G-ZwjjTYqJaQVeHE_linear-gauge.png" size="40" width="982" height="392" position="center" showCaption="false"}

### Gauge

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/FcSJ3EZndDIRmyXm1ug5i_gauge.png" size="38" width="977" height="389" position="center" showCaption="false"}

### Bubble Chart

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/Q_1271j-YYF9R31jZ5O6X_bubble-chart.png" size="42" width="1352" height="451" position="center" showCaption="false"}

## Report Widgets

::Image[]{src="https://api.archbee.com/api/optimize/511c8QBH-VHiwWnyzIwUb/cO1qXh2KPtGdobl4AlPk7_chart-widget.png" size="38" width="2362" height="1132" position="center" showCaption="false"}