图表联动

2025-5-14 Guide
  • 报表设计
  • 技术人员
About 18 min

看板图表联动通过选择或点击某个图表的元素来动态筛选其他图表的数据,相比看板参数,它提供了一种更为直观和交互式的数据探索方式。这种方式减少了用户手动设置筛选条件的步骤,使得数据分析过程更加流畅高效,增强了用户体验。同时,它能够实时展现数据间的关联与影响,有助于更快速地发现洞察。

  • 一对多联动, 支持联动到数据集或者单个图表;
  • 支持排除指定图表的关联;
  • 主动关联与被动状态关联状态可见, 用户可以清除发出的主动关联;

# 联动数据集与图表

  • 看板编辑状态下,从图表右上角功能菜单进入 图表联动 设计卡片, 进入联动设计界面;
  • 点击, 添加 关联对象, 选择联动对象类型
  • 确定添加, 联动对象以标签页的形式出现在下方;
  • 一个图表的点击事件可以关联到多个对象, 设计器下方一个标签页代表一个联动对象定义;
  • 选择指定点击事件 源字段: 源字段与图表设计的行维/列维相对应;
  • 选择关联对象 目标字段: 目标字段与目标对应的数据集或者 AD-HOC 查询相对应, 目标字段通过点击左侧模型树节点选择;
  • 选定源字段与目标字段之后, 点击 添加条件 保存关联条件;
  • 一次点击事件涉及多个维度信息, 用户可以添加其中一个或件多个关联动条件;
  • 联动全局设置: 默认排除自身, 此外还可以选择排除其他的图表不响应联动时间;
  • 添加完毕确认保存;

# 联动状态查看与取消联动

  • 为了让用户了解当前看板数据是否有被联动过滤, 每个发出与接收到联动过滤的图表右上角都会显示状态图表;
  • 看板左下角有当前联动值条件显示
  • 联动状态关闭按钮,可以取消主动发出的联动事件

# 联动到看板

  • 点击事件也可以联动到另外一个同类型的看板
  • 事件参数可以与被连接看板上的参数发生关联,因为联动事件取值通常只有一个值,所以被关联的看板参数类型只能是等值比较,不能是区间比较
  • 也可以不指定参数关联

联动到看板

# 联动到外部链接

  • 点击事件可以跳转到任意外部链接
  • 事件参数可以转化为 url 参数,参数别名可以自定义

联动到外部地址

# 联动弹窗图表

  • 点击事件在看板弹窗,可以用来显示不在看板上图表
  • 如点击 KPI 弹出表格显示对应图表

操作流程

  1. 添加联动对象,选择外部弹窗
  2. 点击浏览,从图表目录树中选择需要关联的图表
  3. 在确认关闭关联对象窗口
  4. 在联动配置关联对象栏配置关联规则
  5. 选择源字段(来自源图表行列维度), 对于 KPI 指标卡之类没有行列维度在图上显示的可以选择常量
  6. 选择过滤类型
  7. 输入常量值
  8. 从左侧目标对应模型选择关联目标字段
  9. 添加条件
  10. 正确关联条件出现在关联条件目录卡之后,确认关闭联动配置窗口

弹窗联动

# 复杂报表联动事件定义(主动)

报表的点击事件是通过,目标单元格(单元格匹配-单元格排除)加单元格表达式(Expression),来定义源点击事件信息

# 单元格定义语法

A1: A1单元格
A: A列所有单元格
1: 第1行所有单元格
A1,B,C: 多个匹配直接用英文逗号分隔
1
2
3
4

# Expression 表达式

Expression 表达式为取值表达式,可以理解为在点击单元格上运行表达式动态取值,

  • 如点击
  • 为必填字段

#号是最简单的表达式取值为取当前点击单元格的值

# 联动参数到环境变量

关联到环境变量之后, 可以用于数据集和查询变量设置, 看板 API 动态请求参数, Query 变量赋值等

一次联动可以产生多个值, 因此添加联动对象窗口 key 值任意输入即可, 真正联动变量名与维度值关系板顶在联动对象编辑栏

联动数据到环境变量

# ECharts标题支持变量v1.10

  • 标题支持变量, 包含联动信息、环境变量、维度信息
环境变量: ${envVars}
变量可以省略envVars前缀如:${year} == ${envVars.year}
联动信息: ${links}
列维度数组: ${groups}
行维度数组: ${keys}
1
2
3
4
5

在数据信息发生发生变化时,动态的变更标题

# 多联动事件

升级前点击联动事件只能区分下钻和联动,多个联动事件只能触发优先级最高的事件(比如联动到看板和数据集同时配置只能触发联动到看板),配置联动到多个看板,选取联动只能生效一个,升级后可以配置

  • 联动到同类型多个对象,
  • 联动到不同类型多个对象
  • 通过弹层菜单让用户自由选择当前触发指定联动对象
  • 支持配置联动别名(相同别名或者不配置别名能够同时触发)

# 交叉表联动区分行表头、列表头、数据

交叉表通过触发部位选择定位联动事件类型,实现点击行、列表头、不同指标列触发不同的联动事件

  1. 区分行维表头到具体列

  1. 区分列维表头到具体行

  1. 区分数据到具体指标

  1. 明细表联动区分到指定列

  1. 另外
  • 只有单一联动的事件直接触发,不再出弹层,增加便捷性
  • 精准联动样式显示,只有联动事件的列会增加下划线
Last update: May 15, 2025 16:07