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

# 柱形图

柱状图是一种常用的对比图表类型，它可以用来比较不同类别或组之间的数据。例如，可以用柱状图比较每个月的销售额，或者比较不同产品的销售额。
柱形图作为最基本的图形有多种展现形式, 从数据角度来可以分为四类:

* 基本: 一个维度和一个度量;
* 多维度: 一个度量和多个维度;
* 多度量: 一个维度和多个度量;
* 多维度多度量: 多个维度和多个度量;

如果按柱形方向来看可以分为:

* 横向
* 纵向

## 基本柱形图

最基本的柱形图为一个维度和一个度量组成, 虽然选择的是柱形图类型, 你仍然可以更改度量组件的显示类型为: Bar, Line, Scatter 三种之一, 同理线图(Line)和散点图(Scatter)也可以改成另外两种显示类型.

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/basic-attributes.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=5c9b26245c67b8aabb3a77391b3405dc" alt="Small" width="814" height="943" data-path="public/img/widgets/bar/basic-attributes.png" />

图形展示如下

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/basic.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=02ba532361a02c4079be729dec5aa6c9" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/basic.png" />

## 多维度柱形图

一般情况下多维度也就是两个维度, 再多的话图形也会比较混乱.

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-dimensions-attributes.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=906b86db58f0ac207cfc345efa95262f" alt="Small" width="807" height="954" data-path="public/img/widgets/bar/multi-dimensions-attributes.png" />

两个维度时, 一个维度作为默认的主维度, 另一个为次维度并可以设置其角色为 `Group`, `Stacked`, `Trellis`:

* **分组(Group)**: 次维度下的成员会在相同主维度成员下并排显示.
* **堆积(Stacked)**: 次维度下的成员会在相同主维度成员下堆积显示.
* **格子(Trellis)**: 按照此维度成员进行分组并分别显示在小格子中.

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/dimension-role.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=00f8f7b4fea2b081bd6f726c0c13a7e5" alt="Small" width="820" height="801" data-path="public/img/widgets/bar/dimension-role.png" />

### 分组

次维度角色设置为 **分组** 时展示效果如下

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-dimensions-group.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=b33909571a540c5e0ef2fe3fe96d8e9b" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/multi-dimensions-group.png" />

### 堆积

次维度角色设置为 **堆积** 时展示效果如下

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-dimensions-stacked.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=53d3a202ce1f07c0e3f8384be202f191" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/multi-dimensions-stacked.png" />

### 格子

次维度角色设置为 **格子** 时展示效果如下

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-dimensions-trellis.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=2a744b865797514cda141b30ca835958" alt="Small" width="1195" height="951" data-path="public/img/widgets/bar/multi-dimensions-trellis.png" />

可以在图形设置板块里, 设置 **格子横向个数**, 决定格子的横向分布个数, 纵向个数将自动计算得出:

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/trellis-h-number.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=9aef24d017d3f2db192bd4e376a63e23" alt="Small" width="800" height="461" data-path="public/img/widgets/bar/trellis-h-number.png" />

## 多度量柱形图

多度量情况下, 度量组件会并排显示; 如果其中一个度量的单位与其他不同, 如增长率为百分比与其他的为金额不同, 那么可以将此度量的角色设置为 `Axis2`, 那么它会显示在不同值轴上, 就形成了双值轴组合图形.

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-measures.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=494e4ad50e36438d5d35fe05cf15c954" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/multi-measures.png" />

如果将其中一个或多个度量组件的 **形状** 属性改成其他如 **线形**, **散点** 就形成了组合图形 (Combination Chart);

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-meausres-combine.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=b537752686ed602e2401bc1248c63249" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/multi-meausres-combine.png" />

## 多维度多度量柱形图

多维度多度量柱形图是在多维度和多度量图形基础上合起来的, 多个维度显示逻辑和多维度图形一样, 多个度量组件会并排显示;

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/multi-dim-measures.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=8c117b47bb9e33c891fc6b507f1ab389" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/multi-dim-measures.png" />

## 柱形方向

改变柱形图的方向属性, 图形坐标的 X 轴和 Y 轴会切换显示;

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/chart-orient.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=ff5136c9eea02655d70f6faa08e0ce9c" alt="Small" width="803" height="381" data-path="public/img/widgets/bar/chart-orient.png" />

横向柱形图展示效果为

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/h.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=84fd0b6e6c30ba8b3f8f0dc8ff9fe790" alt="Small" width="951" height="706" data-path="public/img/widgets/bar/h.png" />

## 极坐标

将柱形图的变式设置为 **极坐标** 可以得到极坐标系下的柱形图

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/variant-polar.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=a9cebb6295876c0fa02f53ed5332d6ae" alt="Small" width="827" height="393" data-path="public/img/widgets/bar/variant-polar.png" />

再加上方向属性的不同可以得到两种极坐标效果

* 极坐标横向柱形图

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/polar.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=689f94dffc9487e1888c04564b5a5a0d" alt="Small" width="951" height="951" data-path="public/img/widgets/bar/polar.png" />

* 极坐标纵向柱形图

<img src="https://mintcdn.com/xpertai/zU5KNaDKlHl8A4Ew/public/img/widgets/bar/radar.png?fit=max&auto=format&n=zU5KNaDKlHl8A4Ew&q=85&s=409205d467d85d3a1bc1d9e546b924ba" alt="Small" width="951" height="951" data-path="public/img/widgets/bar/radar.png" />

## 示例

<iframe src="https://app.xpertai.cn/public/story/point/ffca59a9-f433-4dce-943f-a4ee27d43bf6" width="100%" height="1000px" frameBorder="0" scrolling="no" allowFullScreen />
