---
order: 4
navTitle: 象形柱形图
---
# 仪表板组件-象形柱形图

象形柱形图属于[柱形图](./column-chart.md)的一种，与柱形图的区别在于象形柱形图能够自定义柱子形状。如使用象形柱形图展示各大区销售情况：

![象形条形图](./images/2021-09-16-16-59-35.png)

示例地址：[象形柱形图](https://demo.succbi.com/v5/bi/pictorialbar)

## 使用象形柱形图组件{#start}

象形柱形图的制作方法与[柱形图](./column-chart.md)类似。在**X轴**上至少取1个维度，如省份、产品类型等；**Y轴**上至少取1个度量，如销售数量、利润金额等。

**操作步骤**

![象形柱形图制作](./images/2020_10_19_14_41_19_112.gif)

1. 双击或拖入维度【大区】到**X轴**
2. 双击或拖入度量【销售数量】到**Y轴**
3. 在**数据**>**x轴**，点击大区右侧的下拉按钮，选择**指定字段**进行**排序**并添加排序依据，对【销售数量】进行降序排序

通过上述3个步骤即可快速实现展示各大区的销售数量，且销售数量降序显示。

## 属性介绍{#properties}

### 柱间间距{#space}

象形柱形图支持自定义柱间距，柱子之间的间距在**样式**>**组件**>**布局**>**柱间间距**中进行设置。单系列与多系列下间距设置不同，具体如下：

- 单系列：设置每个柱子间间距
- 多系列：设置不同系列同一个标签上柱子的间距
  ![间距](./images/2023-04-27-11-33-02.png)

### 形状{#shape}

象形柱形图能够自定义柱子的形状，以及柱子是否由形状堆叠构成、间隔、高度、宽度是多少等，在**样式**>**系列**>**销售数量**>**形状**可以设置。象形柱形图与象形条形图的**形状**属性定义一致，具体属性设置可查看[形状](./hpictorialbar.md#layout)。

![形状](./images/2021-09-16-13-46-23.png)

### 填充{#fill}

象形柱形图可以通过**填充**属性控制柱子的填充方式，在**样式**>**系列**>**销售数量**>**填充**中进行设置。象形柱形图与象形条形图的**填充**属性定义一致，具体属性设置可查看[填充](./hpictorialbar.md#fill)。

![填充](./images/2021-09-16-13-52-19.png)

## 更多效果{#scenarios}

### 多系列象形柱形图{#multiple}

多系列象形柱形图可以用来同时展示多个指标，比较不同指标之间的数量大小，体验类似柱形图，但每个系列都可以单独设置形状等属性。
![多系列](./images/2023-04-24-17-45-01.png)

**实现方式**

将多个度量一一拖入**y轴**上，如【折后总额】、【成本总额】

### 图标背景{#background icon}

象形柱形图还可以添加背景的灰色图标，用来更清晰的展示占比情况，可以自定义设置背景图标的形状、颜色等属性。

![背景图标](./images/2023-04-28-14-08-01.png)
**实现方式**

- **添加两个系列**：新建一个值为1的字段，依次拖入该字段和销售数量
- **设置样式**：
  - 形状大小和间距设置成一样的，在**样式**>**系列**>**值为1**>**形状**处，设置合适的形状，调整宽高，层叠设置为是
  - 图标背景设置成灰色，在**样式**>**系列**>**值为1**>**填充**设置
- **设置重叠**：在**样式**>**组件**>**布局**处，把柱间间距调整为-100%。然后将值为1的字段，在**样式**>**系列**>**值为1**>**布局**设置为绘制轴的**y2轴**，与销售数量字段的**y1轴**区分开。

:::tip

1. y轴设置多个度量时，下面的字段会显示在页面的最上层
2. 设置重叠时，如果是显示百分比就不用设置两个轴显示
   :::