文档首页 / 指标卡、进度、排行与表格

指标卡、进度、排行与表格

指标卡、进度组件、排行和表格四类数据展示组件的内容设置、数据绑定方式与阈值告警说明。

概述

这四类组件承载大屏上的核心数字与明细:指标卡显示一个关键数字并带趋势与阈值告警,进度组件显示完成率,排行显示 TOP 榜单,表格显示明细与滚动列表。它们的文案与数值都可以「固定值 / 数据集 / 表达式」三选一绑定到数据,见数据接入。

功能入口

左栏「资源库」>「基础组件」中的「指标卡」「进度 / 液态 / 环形」「排行」「表格/列表」分组;选中组件后,在右栏「组件」>「内容设置」编辑。「内容设置」按段折叠,顶部有分段跳转条。

操作步骤

让指标卡在超阈值时变色

  1. 选中指标卡,在「内容设置」找到「阈值告警」。
  2. 点击「+ 添加规则」,选比较符(≥、>、≤、<、=),填阈值和命中时的颜色,「状态(可选)」可填如「告警」的文案。
  3. 数值命中第一条规则时整卡换成该色。新增规则默认是「≤ 60、红色、告警」。

给排行绑数据集

  1. 选中排行,在「内容设置」>「数据」把「榜单来源」选为「数据集」。
  2. 选「数据集」,再选「名称字段」和「数值字段」。榜单每行取名称字段作左边的名字、数值字段作右边的数,并按数值排序。
  3. 数据集里没有叫 name / value 的列时必须手动指定这两个字段,否则榜单为空。

配置表格的列

  1. 选中表格,在「内容设置」>「数据」点击「列定义」,为每一列设置字段、表头、宽度、对齐与格式。
  2. 在「表格数据来源」选「数据集」,选数据集,让行数据来自数据集;也可选「手工」自己填数据,或选「表达式」写 dataset('ranking').rows() 这样的取行表达式。

属性/参数说明

指标卡

属性 说明 取值/默认值
指标名称、指标数值、说明文案 基本信息,可绑定数据 文本
单位、前缀、后缀 数值修饰,可绑定数据 文本
显示趋势与进度 是否显示趋势、第二角标与进度 显示/隐藏
趋势标签、趋势数值、趋势方向 例如「较昨日」「+12.6%」 方向:上升、下降、持平
第二角标、第二角标值、第二角标方向 同比、环比等,留空则不显示 方向同上
进度值、进度上限 进度信息 数值
卡片样式 卡片外观 玻璃、面板、极简、驾驶舱、灯墙
数值动画 数字入场效果 无、数字滚动、翻牌器
强调色、背景色 颜色 颜色
阈值告警 命中规则整卡换色,首个匹配生效 比较符 ≥ > ≤ < =;空则关闭

进度组件

属性 说明 取值/默认值
标题、说明文案、当前值、上限值、单位、后缀 内容,可绑定数据 文本
展示形态 进度样式 条形、环形、液态
标题位置 标题在组件的位置 顶部、底部
对齐方式 文字对齐 左对齐、居中、右对齐
显示百分比、显示数值 显示项 显示/隐藏
标题字号、数值字号、说明字号、厚度 字号与尺寸 数值
动效强度 波形透明度 0 到 1,步长 0.05
轨道色、强调色、标题色、数值色、辅助色、背景色、边框色、辉光色 配色 颜色

排行

属性 说明 取值/默认值
外观样式 外壳风格;分段选择器里还列有「驾驶舱」,但排行只为前三种定义了外观,选它没有独立样式 玻璃、面板、极简
自动滚动 榜单条目超出可见行数时滚动 开启/关闭
轮播高亮 逐项循环聚焦 开启/关闭
显示条形背景 每行显示条形对比 显示/隐藏
高亮 Top 3 前三名高亮 高亮/普通
可见行数 同时显示的行数 1 到 12
滚动时长 (s) 滚动周期 6 到 120
榜单来源 数据来源 手工、数据集、表达式
榜单内容 手工来源,每行一项 例如 杭州: 98
数据集、名称字段、数值字段 数据集来源 见上文
表达式、缺省值(可选) 表达式来源,表达式为空时使用缺省值 例如 dataset('ranking').rows()
变量过滤 用页面变量筛选已取回的行,变量无值时显示全部 数据字段、变量、等于/不等于
条形色、轨道色、名称色、数值色、行背景色 配色 颜色

表格

属性 说明 取值/默认值
展示模式 表格形态 标准、分组、日志、事件、时间轴
分组字段 仅「分组」模式,按该列分组显示 例如 region
显示表头、显示序号 显示项 显示/隐藏
自动滚动、滚动方式 行数超出时滚动 连续滚动、分页切换
性能保护下保留滚动 性能保护模式下是否仍保留滚动播放 保留/降级
轮播高亮 当前行循环聚焦,适合短表 开启/关闭
可见行数 同时显示的行数 1 到 12
滚动时长 (s) 滚动周期 6 到 120
表格数据来源 行数据来源 手工、数据集、表达式
手工数据 手工来源,行对象数组 例如 [{time: 10:21, region: 滨江区}]
缺省值(JSON,可选) 数据为空时使用 例如 []
变量过滤 同排行 数据字段、变量、等于/不等于
表头背景、表头文字色、内容文字色、斑马纹背景 配色 颜色
空状态文案 无数据时的提示 文本

表格列定义

属性 说明 取值/默认值
字段 数据行的字段名 必填
表头 列标题 文本
列宽 单位 px 留空为自适应
对齐 列对齐 左对齐、居中、右对齐
格式 值格式 文本、数值、百分比、金额、徽标
小数位 数值格式的小数位数 数值
单位 / 货币符号 金额格式显示「货币符号」,其余显示「单位」 文本
阈值染色 ≥ 预警、≥ 危险、≤ 预警、≤ 危险,超过阈值时该列的值变色 数值,留空为不启用

示例

「科室就诊」指标卡:「指标名称」填 今日就诊,「指标数值」绑定数据集 科室就诊 的 visits,取值策略选「求和」,「单位」填 人次,「数值动画」选「数字滚动」。在「阈值告警」添加规则「≤ 3000、红色、偏低」,则总数不超过 3000 时整卡变红并显示「偏低」。

注意事项

注意:表格没有组件级维度列,「分组字段」只用于分组显示;零配置联动时表格行按行里第一个非数值列过滤。

注意:变量过滤是前端过滤,不参与取数;要按变量重新查询数据,请让数据集参数引用变量,见数据接入。

提示:表格、排行和图表的数据项可点击,发出「点击数据项」事件,用于联动,见交互与联动。

相关文档

联系我们

请填写您的信息,我们将在 1 个工作日内与您联系。