历史版本19 :表格组件样式概述 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

FineBI 版本JAR 包
5.1待定

1.2 应用场景

用户在进行制作表格组件时,需要对表格进行字体、风格等样式。

1.3 功能简介

表格的组件样式包括标题、字体、格式、背景等的设置,通过这些设置可以调整表格的显示样式。,如下图所示:

29.png

注:如果浏览器设置了最小字体,而仪表板图表中设置的最小字体小于浏览器的最小字体,那么以浏览器为准,比如说chrome浏览器的最小字体为12号,图表设置的字体大小为10号,在chrome下查看图表时,图表字体显示为12号,而非10号,故此时需要修改浏览器字体大小。  

2. 标题编辑

1)标题设置包含了是否显示标题标题内容标题字体样式标题背景的设置,分组表、交叉表、明细表均可设置,如下图所示:

1.png

2)默认组件标题为勾选显示,若不想显示,去掉勾选即可,如下图所示:

1587986594278656.png

2.1 内容

1)在标题的内容框可以修改标题文字字体样式。点击内容框右下角的编辑按钮对标题进行详细设置,支持对标题中的各个字符分别设置显示效果,如下图所示:

1587986712121212.png

2)字体样式分为自动自定义两种类型,勾选自定义后,可修改该标题显示的字体、大小、颜色、下划线、加粗、显示位置等样式,点击确定即可保存,如下图所示:

29.png

2.2 背景

背景可以设置标题栏的背景,包含两种类型:颜色图片,分组表、交叉表、明细表均可设置,如下图所示:

1587987111608695.png

2.2.1 背景颜色

在勾选显示标题的情况下,可对组件标题栏的背景进行设置。颜色设置有自动透明具体颜色选择方式,如下图所示:

1587987442314316.png

2.2.2 背景图片

图片可以选择上传背景图片,支持的图片格式为jpgpnggifbmp,选择图片,点击上传,如下图所示:

1587987570606933.png

3. 表格字体编辑

表格字体可以设置表格中字体的样式,包含自动自定义两种,分组表、交叉表、明细表均可设置。

1.png

3.1 自动

自动为 FineBI 默认的表格字体样式,如下所示:

表位置设置
表头微软雅黑、12号字体大小、居中显示
表身微软雅黑、12号字体大小、维度左对齐、指标右对齐

3.2 自定义

自定义可分别设置表格的表头和表身字体,表身又可单独设置维度和指标字体在表格中的显示位置:居左、居中和居右,如下图所示:

1.png

4. 风格编辑

表格类型支持设置
分组表类型、风格和主题色
交叉表类型、风格和主题色
明细表风格和主题色

风格可以设置表格的展示类型风格主题色,如下图所示:

1587988000280975.png

4.1 类型

分组表和交叉表的显示类型包含多列展示树状展示列表展示

4.1.1 多列展示

多列展示如下图所示:

1587988425708401.png

4.1.2 树状展示

如下图所示:

1587988517340289.png

4.1.3 列表展示

如下图所示:

1587988609818074.png

注:分组表同一维度下相同字段值不合并展示,交叉表同一维度下相同字段值行不合并、列合并。

4.2 风格

表格展示风格有三种,表头有颜色区域隔行间隔色、表头有颜色区域隔行无颜色、表头值区域都无颜色,且默认为第一种。

4.2.1 表头有颜色区域隔行间隔色

如下图所示:

1587989062949200.png


5.2.2 表头有颜色区域隔行无颜色

如下图所示:

1587989110529872.png


5.2.3 表头值区域都无颜色

如下图所示:

1587989153190137.png


5.3 主题色

主题色可修改表格展示时的背景颜色,同样可选择自动透明具体颜色,例如选择绿色为主题色,如下图所示:

1587989259625319.png

6. 合计行/列编辑

表格类型支持设置的合计行/合计列支持设置方式
分组表合计行是否显示合计行、是否显示组内合计行、显示位置、合计方式
交叉表合计行、合计列是否显示合计列、是否显示组内合计列、显示位置、合计方式
明细表不支持不支持

合计行/列可以设置是否显示、显示位置和合计方式,如下图所示:

1587995319118983.png

分组表因为不存在列维度,因此仅能设置合计行,同样可设置是否显示、显示位置及合计方式;合计方式包含自动和自定义两种,如下图所示:

1587995357748272.png

6.1 显示合计行/列

交叉表可以选择显示合计行合计列,或者同时显示,如下图所示:

4.png

默认为合计行命名为合计,也可修改合计行名称,例如修改为合同金额合计值,如下图所示:

39.png

注:若修改显示合计行后面的合计行名称,则组内合计行名称会与显示合计行名称一致。

6.2 显示组内合计行/列

以交叉表为例,选择组内合计行组内合计列,或者同时显示,如下图所示:

25.png

注:2020-01-15 版本升级至   版本默认勾选。

6.3 位置

合计行的位置可设置为顶部底部,默认在底部显示;合计列的位置可设置为左侧右侧,默认为右侧显示。勾选显示合计行并设置位置为顶部,勾选显示合计列并设置为左侧,如下图所示:

1587990742696210.png

6.4 合计方式

合计方式支持自定义设置求和、平均、最大值、最小值、中位数、方差、标准差、隐藏。

6.4.1 自动

合计方式自动即表示根据指标的汇总方式自动显示,如下图所示:

0.png

6.4.2 自定义

可自定义合计的汇总方式。为合同金额的合计自定义平均,并为显示合计行名称设置为平均,则图表中的合同金额合计行/列均为求平均的值,且合计列名称会自动变为平均:合同金额(求和),若存在多个指标字段,则可对每个指标字段分别设置合计方式,如下图所示:

22.png

6.4.3 合计方式为隐藏

当有些指标的合计值按照BI的逻辑计算出来是没有意义的,但是这个表格中其他指标的合计值又是有意义的,针对这一列的合计值可以设置隐藏其合计值。如为合计方式中的购买数量选择隐藏,则在表格中就不会显示,如下图所示:

1587990981669922.png

注:此处介绍的合计行设置位置及隐藏功能需 2019-01-15 之后的 FineBI5.1 版本支持。

7. 格式编辑

表格类型支持设置内容
分组表行高、分页行数、是否显示序号、是否展开行表头节点
交叉表行高、分页行数、分页列数、是否显示序号、是否展开行表头节点
明细表行高、是否显示序号和总行数

7.1 行高

行高设置的是表格中的行间距,如下图所示:

1.png

7.2 分页行数

分页行数设置表格每一页显示多少行,超过该行数就到下一页显示,例如设置分页行数为10 ,则显示10行,其他数据分页至下一页显示,如下图所示:

1587991562637241.png

注:2019-07之后的版本中,表格数据内容仅有一页时,将不显示底部的页码信息。多于一页时,页码信息、翻页按钮正常显示。

7.3 显示序号

显示序号勾选后在表格增加一列,第一列用于显示序号信息,按顺序排列,勾选显示序号,如下图所示:

1587991643294869.png

7.4 展开行表头节点

展开行表头节点表示展开表格分组的所有表头节点,分组中的表头节点分别为收起/展开状态,如点击取消勾选展开行表头节点,则如下图所示:

1587991775823629.png

点击勾选展开行表头节点,则如下图所示:

1587991849604811.png

除勾选展开行表头节点外,也可直接点击表格最上方的+展开所有的行/列查看,如下图所示:

注:该点击展开的方式仅支持查看展开数据,并不能保存展开所有行表头节点的设置,刷新以后仍然为收起的状态。  

1587991942823974.png

7.5 总行数

明细表的总行数说明可参见: 总行数 。

7.6 冻结表格维度/首列

冻结表格维度功能为固定表格中的维度字段宽度,在表格通过滚动条左右或上下滑动时,冻结维度字段宽度与位置保持不变,如下图所示:

1587992311264634.gif

注:在明细表中提供的为冻结首列,即固定明细表第一列的字段宽度及位置保持不变。

7.7 自动换行

注:该自动换行功能在 2020-01-15 之后的 FineBI 版本支持。

当表格内容较多,单个表格显示不下时,需要使用自动换行功能,根据表格字段内容自动换行显示,如下图所示:

1587992543875870.png

开启自动换行后,表格文字内容超过列宽时自动换行,如下图所示:

1587992644725927.png

8. 背景编辑

背景可以设置表格组件的整体背景,分为颜色和图片两种,分组表、交叉表、明细表均可设置,如下图所示:

1.png

表格组件的背景颜色同样可以设置自动透明具体颜色,同标题背景颜色,请参见 2.2 节内容。

上传后的图片保存在工程中的 temp_attach 文件夹。

9. 交互属性编辑

表格类型支持/不支持
分组表、交叉表支持
明细表不支持,默认为勾选状态

交互属性可以设置是否联动传递过滤条件,如下图所示:

1.png

9.1 适用范围

联动传递过滤条件用于选择是否设置联动传递过滤条件,传递的过滤条件为指标的明细过滤条件,默认为选中状态。

适用范围:

功能说明
联动仅用于默认联动,自定义联动不支持传递指标的明细过滤条件
跳转跳转分享模板:1)未勾选对跳转目标传值;2)勾选对跳转目标传值,但未设置传递字段或者仅设置了源字段。

9.2 示例

以联动为例进行介绍,跳转功能同理。

1)例如用销售DEMO下的合同事实表创建两个表格组件,如下图所示:

49.png

2)对组件 1 的合同金额进行指标明细过滤,过滤条件为合同付款类型属于一次性付款,如下图所示:

8.png

3)设置联动条件为自动,并勾选联动传递过滤条件。如下图所示:

42.png

4)点击组件1 服务协议对应的合同金额字段,可查看联动到组件2后,除了显示合同类型属于服务协议的对应数据,还传递了明细过滤条件合同付款类型属于一次性付款,如下图所示:

1.png

5)当取消勾选联动传递过滤条件,则仅传递合同类型属于服务协议的对应数据,如下图所示:

4.png