[]
        
(Showing Draft Content)

KPI卡片

1.概述

1.1功能概览

KPI卡片是直观展示KPI数值的组件,在提供数据展示的同时,还提供了设置图标的功能,可以让KPI卡片的样式更丰富。

1.2应用场景

KPI组件在数据可视化中的作用在于快速传递关键信息、突出重点、支持实时监控和目标对比,其意义体现在提升决策效率、增强焦点和简化数据沟通。应用场景覆盖商业、运营、财务、营销等多个领域,是数据可视化中连接数据与行动的关键桥梁。

2.添加KPI卡片组件

从设计器左边的组件面板中,将KPI卡片组件拖拽至画布区域。

image

3.数据绑定

将图表添加至设计器画布区域后,数据绑定面板会自动打开,用户可根据需要选择所需的数据集或数据模型。

将需要的字段拖拽至对应的数据绑定区域来进行图表的绘制:

image

数据绑定区域

说明

数值

可绑定任意数据类型的字段。可绑定不超过3个字段。

4.美化KPI卡片

提供了一系列的属性设置来协助用户进行KPI卡片的美化。

4.1设置图标

提供了一系列的属性设置供用户进行图标样式设置

image

属性

说明

显示图标

用于控制是否显示KPI卡片的图标,默认值为“是”;置为“否”时,将隐藏该图标。

图标

用来指定KPI卡片的图标。点击后展开图片选择对话框,用户可根据需要选择或上传所需要的图标。

图标宽度/图标高度

用来控制图标的大小。默认值均为80px。

用户可根据需要进行设置,图标将会根据设置的宽度和高度进行拉伸。

图标位置

用来控制图标在KPI卡片组件中的位置,默认显示在KPI指标的左侧。

用户可根据需要来指定图标的位置。

图标间距

用来控制图标与KPI组件之间的间距,默认值为20px。用户可根据需要进行设置。

4.2指标样式

设置KPI指标的样式,如排列方式、对齐方式、字体、字体颜色等:

image

属性

说明

指标布局

用来控制多个KPI指标的布局方式,默认为横向排列,可设置为纵向排列

指标间距

用来控制多个KPI指标的检举,默认为20px。

显示指标名称

用来控制是否显示KPI指标的名称,默认显示。

指标名称默认为绑定到数值区域的字段的名称,用户可通过在数值绑定区域中的字段的重命名来进行对指标名称的修改。

指标名称位置

用来控制指标名称与KPI指标的位置,指标名称默认显示在KPI指标的上方。

指标名称对齐方式

用来控制指标名称与KPI指标的对齐方式。

只有当指标名称位置为上侧或下侧时,才提供这个选项。

指标名称字体设置

用来控制指标名称的字体、大小、颜色等,用户可根据需要进行设置。

指标值字体设置

用来控制KPI指标值的字体、大小、颜色等,用户可根据需要进行设置。

4.3后缀样式

image

属性

说明

指标后缀设置

点击字段后的编辑按钮,在弹出的对话框中,即可为该KPI指标添加后缀。

用户可根据需要输入“后缀单位”或指定“后缀图标”。

后缀间距

用来控制后缀单位和后缀图标之间的间距,默认值为3px。

后缀图标大小

用来控制后缀图标的大小,默认值为10px。

后缀字体设置

用来控制后缀单位的字体及样式。