跳到主要内容

柱状图

主要用来反映数据差异,也可以反映数据走势

何时使用

使用在数据对比的场景,显示数据之间的差异

  • 显示汽车品类销量数据
  • 显示年纪班级成绩数据

一、属性

1.数据源

数据源绑定方式详见数据绑定

2.X轴

设置柱状图的横坐标的数据,标题,标题位置和轴线、刻度线等样式。

image-20250604153505844

image-20250604153531197

3.Y轴

Y轴数据的大小决定柱状图的高度,可以在Y轴设置最大最小值、标题、轴线和刻度线等样式。Y轴的数据项也可以设置多个。

image-20250604153957774

image-20250604154011775

4. 标题

可以设置主标题、子标题、标题文字大小、标题位置等样式。

image-20250604160303832

image-20250604160324635

5.外观

可以设置柱状图的展示(是否以条形图的方式),以及柱状图的高宽,位置,圆角样式。

image-20250604163748041

image-20250604164047945

6. 图例

可以设置柱状图的图例是否显示、位置、宽度、颜色等样式。

image-20250604165152286

image-20250604165221774

7. 标签

标签及柱状图每一条数据上显示的数值。可以设置位置以及大小、是否显示。

image-20250604165805895

image-20250605082636791

8. 提示框

设置鼠标悬停到柱状图之上时,是否弹窗显示。以及弹窗的文字样式。

image-20250605083136387

image-20250605083220324

9. 预设颜色列表

可以设置柱状图的颜色显示。

image-20250605083351355

image-20250605083408060

10. 状态

详见通用属性

二、规则

1. 表单校验

2. 显示控制

三、样式

详见通用样式

四、常见使用场景

==1.汽车品类销量对比数据==

BarChart01

==2.班级成绩数据==

BarChart02