[]
        
首页
开发者学堂
文档
论坛
市场
生态机会
活动
在线Demo 免费试用
(Showing Draft Content)

数据表

1. 概述

1.1 功能概述

数据表组件是用于原生数据集直显的基础工具,以行列结构完整呈现未经聚合的原始数据记录,保障数据审计的透明性和分析溯源性。

2. 操作步骤

本文将指导您在Wyn中创建和使用数据表。

2.1 前提条件

  1. 数据要求: 已完成数据连接与数据准备,本文将以本地Excel文件缓存数据集为例演示操作流程。

  2. 界面要求: 已进入仪表板设计界面,且仪表板至少已绑定一个数据集/数据模型(如“Excel数据-缓存数据集”)。

2.2 操作步骤

2.2.1 添加组件

  1. 仪表板设计界面最左侧,单击组件按钮展开列表,选择数据表,按住鼠标左键将其拖拽至仪表板设计区域,成功添加一个数据表组件。

    image

2.2.2 绑定数据

  1. 仪表板设计器设计区域选中数据表,根据实际需求,将对应的字段拖拽至“列”绑定区域(支持多字段绑定)即可完成数据绑定。

    image

  2. 数据绑定区域介绍,参考下表:

    示意图

    数据绑定区域

    说明

    image

    绑定任意类型字段,可绑定一个或多个字段

    提示标签

    提示标签是指当鼠标移至图形时,会出现相应的提示信息。使用方法详见鼠标提示标签

2.2.3 数据处理

  1. 组件完成数据绑定后,可自由调整字段属性(如格式修改、重命名等),具体操作步骤请参考数据绑定与动态计算

    image

    注意:

    对数据集中字段进行的操作会在当前仪表板中的所有组件生效;而对组件数据绑定区字段进行的操作仅在当前组件生效。

2.2.4 组件属性

  1. 数据处理完成后,可通过以下属性配置进一步优化组件展示效果:

    属性

    说明

    系统图示

    表格设置

    设置数据表的表格属性

    image

    动画

    设置组件入场动画和滚动属性

    数据交互

    配置联动、跳转、刷新等行为

    分页设置

    设置数据表的分页属性

    标题

    组件标题的样式属性

    提示标签

    鼠标悬停时显示数据点详细信息

    列头

    设置数据表的列头属性

    列设置

    设置每列的样式

    奇数/偶数列条纹区域

    设置数据表奇数/偶数行的属性

    总计区域

    设置数据表的总计区域属性

    特殊数据

    自定义空值/空白数据的显示规则

    布局大小

    调整组件位置于整体尺寸

    外观样式

    调整组件外观样式

    除了上述属性之外,还提供更多选项来进行样式的控制,请根据需要对其外观属性进行进一步的个性化设置。

3. 应用示例

3.1 分页设置

默认情况下,会自动为数据表进行分页处理,用户可根据实际需要,在属性设置的“分页设置”中进行设置,包括是否开启分页、显示每页数量、每页行数以及分页栏的样式等属性。

image

3.2 列头

3.2.1 列头的基本样式设定

  • 在属性设置中,可通过列头自动标记数据表的列头属性,包括文本折行显示、背景色、列名字体设置和边框颜色。

image

3.2.2 设置复杂表头(多行列头)

  • 选中组件,单击“编辑列头”按钮进入列头编辑器,可对数据表的列头进行编辑。

image

操作

系统图示

选中行号,通过右键菜单可增加/删除/行,重置行高

PixPin_2025-06-04_16-08-06

双击单元格,可进入到单元格的编辑状态来输入内容。

PixPin_2025-06-04_16-09-42

选中多个单元格,通过右键菜单,可以进行合并、绑定数据列等操作

PixPin_2025-06-03_19-04-37

鼠标悬停至列与列之前的位置,可通过拖拽调整列宽

数据表编辑

完成修改之后,单击左上角的“退出列头设计器”,保存设置即可生效

PixPin_2025-06-03_19-05-51

3.3 设置列样式

为了使数据表展示的样式更丰富,用户可通过列设置属性对每一列进行逐一设置,提供默认值、图片展示、进度条及富文本编辑的能力。

前提:用户首先绑定数据然后选择需要设置的列,然后在下方具体设置该列的样式。

image

3.3.1 表头设置

在列头区域可以对数据表的所有表头进行样式的设置,在列设置的区域中可针对特定的列来设置列头的对齐方式和宽度的模式。

image

  • 水平对齐:设置该列表头内容的对齐方式,默认为居中对齐,用户可根据需要自行调整。

  • 固定宽度:设置列的宽度是自适应还是固定宽度

    • 该选项关闭,默认值,查看模式下表格列将沿用设计阶段的列宽比例,并随页面可视空间自动拉伸适配。

    • 该选项打开,用户设置固定的列宽宽度,在查看模式下,该列将以固定的宽度显示,不会随着空间的变化进行拉伸。

3.3.2 显示默认值

即提供单元格的基本样式设置,如单元格的对齐方式。

image

  • 单元格类型:支持4中类型,默认值是默认,意思是显示绑定数据的实际值。

  • 水平对齐:默认为自动对齐,会按照该列所绑定的字段类型进行自动对齐,如文本型默认居左对齐,数值型默认居右对齐。用户还可根据需要自行调整对齐方式。

  • 垂直对齐:默认为居中,文本在单元格的垂直方向居中对齐,用户可根据需要自行调整对齐方式。

3.3.3 显示图片

当绑定字段的数据类别为图片URL图片二进制数据图片Base64码时,在仪表板中绑定到数据表组件中通过设置单元格类型为图片进行显示。

1)将字段绑定到数据表中

image

2)在列设置区域中,指定对应的列,将单元格类型指定为图片,当单元格的值为图片URL图片二进制数据图片Base64码时,该列的内容会被渲染成图片。

image

3)当单元格类型被指定为图片时,还提供了相关的图片属性供用户使用

  • 内部边距:默认图片撑满整个格子,可以根据需要来设置图片与单元格之间的空隙。

  • 图片布局:支持三种布局,默认为“等比拉伸”,即根据单元格的高度对图片进行等比的缩放。用户可根据需要修改为原始大小或填充。

注意:

当单元格的值不是图片URL图片二进制数据图片Base64码时,即使指定为图片,也不会被渲染成图片。

3.3.4 显示进度条

在某些应用场景下,希望用进度条来展示完成率、利润率等指标,可以通过设置单元格类型为“进度条”来完成。

image

  • 使用固定高度:默认值为,即使用固定高度,用户可在下方的进度条高度(px)中指定高度。若为否,进度条的高度将根据单元格的实际高度进行进行拉伸。

  • 内边距:设置进度条与单元格之间的间隙。

  • 背景色:用于设置进度条的背景色。

  • 进度色:用于设置进度条的颜色。

  • 进度条圆角:值越大,进度条的圆角越圆。

  • 样式类型

    • 默认:样式为一般的进度条样式

    • 段式:提供分段式的进度条样式,用户可根据需要配置分段个数及分段间距

  • 显示标签值:默认为关闭,当打开该开关,将在进度条中显示数值标签。用户可根据需要设置标签颜色以及位置。

注意:

进度条的最小值为 0,最大值为 1。因此建议绑定列的取值范围设置在 0 至 1 之间。

3.4.5 显示富文本

若想对列的内容进行更丰富的设置,比如增加图片、设置文字颜色、字体等,可以通过设置单元格类型为富文本来完成。

image

  1. 点击内容,打开富文本设置对话框。选中文本,可选择设置字体、大小、样式等。

    image

  2. 绑定图片,两种方式

    方式一: 点击图片图标,可在光标位置插入图片。该方式适用于一列显示同一个图片。

    image

    方式二: 点击绑定字段,可选择添加已绑定字段到该列中,实现在一个单元格中显示多个字段内容,该方式适用于一列显示不同的图片。

    image

3.4 总计区域

数据表默认展示非聚合的明细数据,同时支持自定义开启显示总计行功能,您可根据业务需求,为指定列配置对应的聚合运算规则。

您可在列字段绑定区域,为需要统计的字段展开「总计设置」(默认值为「无」),选择对应聚合函数;只要有任意字段配置了总计规则,数据表将自动在底部显示总计行。

image

用户还可以根据需要对总计行进行设置:

image

  • 汇总范围:用于设置聚合范围

    • 所有数据:默认值,默认聚合该数据表中的所有数据

    • 当前页:总计值的聚合范围为数据表的当前页。

  • 标签:设置总计行的标签,显示数据表的行号时,总计标签才会显示出来。

  • 位置:设置总计行的显示位置。

    • 每页顶部/每页底部:总计行显示在表格每页的顶部/底部。

    • 表格顶部/表格底部:总计行显示在整个表格的顶部/底部。

  • 锁定汇总:开启后,总计行固定于位置(每页顶部/每页底部/表格顶部/表格底部),滚动时保持不动,实现“冻结”效果,总计行数据始终可见。

  • 背景色:设置总计行的背景色。

  • 字体设置:根据需要对总计行的字体、大小、颜色等样式进行设置。

  • 边框颜色:设置总计行边框颜色。

4. 数据探索与分析

  1. 组件内置丰富的数据探索与分析功能,从多角度挖掘数据价值,为您的可视化分析提供专业级支持。

    PixPin_2025-06-03_18-48-01

5. 注意事项

  1. 如果组件单独配置了属性,则该配置优先级将高于仪表板全局设置中的对应属性。