Wyn嵌入式BI实战(三):仪表板筛选器\+报表查询面板,参数联动全闭环
系列导读:本系列带你打通 JSON API 带参数数据源的全链路——从数据接入、数据准备,到仪表板/报表的参数联动。
- 第 1 篇(接入篇):配置带参数的 JSON API 数据源
- 第 2 篇(准备篇):直连模型选型,参数为什么不生效?
- 第 3 篇(联动篇):仪表板筛选器+报表查询面板,参数联动全闭环

参数已经"流"到了哪一层?
前两篇我们走完了两段路:
- 第一篇:配好了带
id参数的 JSON 数据源,基址jsonplaceholder.typicode.com,三个端点 posts/users/albums - 第二篇:基于直连模型把数据源变成了可分析的数据模型,参数从数据源流转到了模型层
但到目前为止,参数用的还是默认值 1,2。真正的业务场景里,用户想在大屏上切换租户、在报表查询面板里输入日期范围,让数据跟着变。
本篇带你完成四件事:
- 仪表板侧:仪表板参数 + 筛选器联动,改筛选器即触发接口重新调用
- 仪表板嵌入场景:用 URL 传参
?dp={"id":[2]}由宿主系统动态传值 - 报表侧:报表参数 + 查询面板,控件驱动参数,参数驱动数据集
- 仪表板是"筛选器驱动",报表是"查询面板驱动",机制不同选型不同
一、仪表板:仪表板参数 + 筛选器联动
1.1 新建仪表板,绑定直连模型
新建仪表板,数据源选择第二篇建好的直连模型。拖一个数据表组件到画布,绑定 users 表的字段(如绑定 id、 name、email、phone)。

1.2 仪表板参数关联数据源参数
给组件绑定模型的数据后,系统会自动生成一个仪表板参数和模型参数绑定。这个仪表板参数要和第二篇数据源里的 id 参数对应起来——仪表板参数是"对外"的,数据源参数是"对内"的,两者要建立关联。在仪表板的全局属性设置里找到"仪表板参数",可以看到已自动新增一个仪表板参数。

仪表板参数属性介绍:
1.3 加筛选器组件,绑定仪表板参数
- 拖一个筛选器组件到仪表板(如标签筛选器),绑定数据(绑定 posts 表的 id),设置属性(多选)。编辑仪表板参数,将筛选器绑定至仪表板参数。选中筛选器,给筛选器的默认值绑定仪表板(这样筛选器默认就会选中 1 和 2)。

1.4 闭环验证——更改筛选器值,数据刷新
现在验证闭环。在仪表板预览界面修改筛选器的值,观察数据表数据:
- 用户改筛选器选中的值 → 仪表板参数值改变,例如变成
4 - 仪表板参数传递到模型 → 模型带着
id=4调接口 - 接口返回 →
https://jsonplaceholder.typicode.com/users?id=4的数据 - 数据表刷新 → 显示 id 为 4 的数据
参数一变,接口重新调用,数据实时刷新。这就是我们要的闭环。

二、仪表板嵌入:URL 传参
筛选器适合业务用户在 BI 里手动操作。但仪表板嵌入到门户网站或其他应用时,往往需要宿主系统自动传参,不让用户手动选。
Wyn 支持通过 URL 传参。在仪表板的访问 URL 后拼接参数即可:
关键在 dp={"id":[2]} 这个部分——dp 是仪表板参数的缩写,后面跟着参数名和值的 JSON。这个 id 就会作为仪表板参数传递到模型在触发接口用 id=2 调用。
多租户场景下,宿主系统根据当前登录租户动态拼接这个 URL,就能实现"每个租户看自己的数据",全程无需用户手动操作。

URL 传参和筛选器可以并存:URL 传参是"初始值",筛选器让用户在此基础上进一步调整。
三、报表:报表参数 + 查询面板
仪表板讲完了,来看报表。报表的参数机制和仪表板不一样,是"查询面板驱动"——用户先在查询面板里填条件,再点查询生成报表。
3.1 报表参数机制与仪表板的差异
先说清楚两者区别,这决定了你该用哪个:
简单说:仪表板像"边看边筛",报表像"先问再答"。

3.2 新建报表数据集,引用 JSON 数据源参数
创建报表前,先创建数据集,选择直连数据集。数据集的数据源选第一篇配好的 JSON 数据源,将带参数的表拖动到关联关系界面(例如 users),创建数据集参数(参数类型必须是用户输入),然后将数据集参数和数据源参数绑定,最后保存数据集。

3.3 创建报表,报表参数配置查询面板控件
新建空白 RDL 报表,选择上一步保存的数据集,系统会自动创建一个和数据集参数同名的报表参数。报表参数是查询面板的"骨架"。报表参数名称 id,类型字符串,多值。

接着配置报表参数的可用数据,然后把它配置到查询面板上,选择合适的控件类型(例如下图我选择的是下拉列表)。

Wyn 的查询面板支持多种控件:
本例用下拉框控件,让用户选择 id。
3.4 闭环验证——查询面板传参
预览报表,在查询面板的列表框里选择 3,点击预览:
- 查询面板收集参数值 → 报表参数 id
= 3 - 报表参数传入数据集 → 数据集带着
id=3 调接口 - 接口返回 →
https://jsonplaceholder.typicode.com/users?id=3的数据 - 报表渲染 → 展示 id 为 3 的数据
和仪表板的闭环逻辑一致,只是触发方式从"筛选器实时联动"变成了"查询面板点查询"。

四、报表嵌入:URL 传参
下拉列表适合业务用户在 BI 里手动操作。但报表嵌入到门户网站或其他应用时,往往需要宿主系统自动传参,不让用户手动选。
Wyn 支持通过 URL 传参。在报表的访问 URL 后拼接参数即可:
关键在 dp={"id":[4]} 这个部分——dp 是传递报表参数的关键,后面跟着参数名和值的 JSON。这个 id 就会作为报表参数传递到数据集参数,在到数据源参数,从而触发接口用 id=4 调用。
多租户场景下,宿主系统根据当前登录租户动态拼接这个 URL,就能实现"每个租户看自己的数据",全程无需用户手动操作。

五、仪表板 vs 报表,参数机制对比表
把两边的参数机制放一起对比,方便选型:
一句话选型:要交互、要实时切换用仪表板;要固定格式、要复杂查询条件用报表。 两者都能实现"改参数即换数据",只是交互形态不同。
六、完整闭环演示
把三篇串起来,完整闭环是这样的:
举一个多租户场景的完整例子:
- 宿主系统识别当前登录租户 ID = 5
- 拼接仪表板 URL:
...?dp={"id":[5]} - 仪表板加载,参数
id=5下推到直连模型 - 模型调用
https://jsonplaceholder.typicode.com/users?id=5 - 接口返回租户 5 的数据,仪表板展示
- 租户在大屏上用筛选器进一步切换,数据实时跟随
全程参数驱动,接口实时响应,数据隔离且安全。
【截图位置 11:完整闭环示意图,展示从用户操作到接口调用到展示刷新的全流程】
七、系列总结
三篇走完,JSON API 带参数数据源的全链路打通了。回顾一下:
第一篇(接入篇):配好带参数的 JSON 数据源,用"基址 + 端点"管理多个接口,在基址定义公共参数 id。
第二篇(准备篇):选直连模型(不是抽取模型)和直连数据集(不是缓存数据集),让参数能在运行时实时生效;参数经历"数据源定义 → 模型引用 → 仪表板/报表使用"三层流转。
第三篇(联动篇):仪表板用"仪表板参数 + 筛选器 + URL 传参",报表用"报表参数 + 查询面板",用户改参数 → 接口返回对应数据 → 展示刷新,闭环成立。
整条链路适用的场景就三个:SaaS 多租户数据隔离、数据中台 API 服务化封装、IOT 物联网平台数据查询。本质都是"BI 不能直连数据库,只能通过 API 拿数据,且数据要按参数动态过滤"。
希望这个系列能帮到正在做 BI 嵌入、多租户数据分析的同行。如果有疑问或想看其他场景的实操,欢迎评论区交流。
扩展链接
葡萄城是专业的软件开发技术和低代码平台提供商,聚焦软件开发技术,以“赋能开发者”为使命,致力于通过表格控件、低代码和BI等各类软件开发工具和服务,一站式满足开发者需求,帮助企业提升开发效率并创新开发模式。
更多推荐




所有评论(0)