谈谈我使用 GoView 来做 ThingsBoard 的大屏想法
很多人反馈：ThingsBoard 自带仪表盘不好看。
客观说，ThingsBoard Dashboard 其实很灵活，能做不少东西；但视觉风格和交互习惯，确实不太贴国内常见的「数据大屏」审美——这是事实。
于是我就在想：能不能找一款国内开源大屏，和 ThingsBoard 打通？看了一圈之后，选中了 GoView，开始踩坑、验证想法。过年在家也在折腾这块。想做成成熟产品还有距离，但思路已经跑通了，下面分享成果与用法。
开源地址
验证已跑通，代码已开源，感兴趣可以拉下来玩：
仓库名以 Gitee 上当前实际项目为准；本文侧重讲思路与用法，不绑定某一个固定仓库路径。
本地演示怎么跑
- 克隆仓库到本地（需已安装 Node 等前端环境）。
- 用 WebStorm / VS Code 打开工程。
- 在
vite.config.ts里改成你的 ThingsBoard 后端地址。
- 安装依赖并启动：
npm install
npm run dev
- 浏览器访问（示例）：
http://localhost:3020/#/login
使用 ThingsBoard 租户账号登录后进入首页：
点击「测试数据」中的编辑，进入大屏编辑界面：
编辑里我增加了 别名 和 筛选器（思路对齐 ThingsBoard Dashboard 的实体别名 / 过滤），下面带你走一遍最小用法。
使用：别名 → 组件 → 订阅 → 过滤脚本
1. 配置别名
点击别名，添加实体过滤条件；筛选器用于进一步过滤。整体体验接近 ThingsBoard 仪表盘里的别名概念。
2. 拖一个文本组件显示温度
从左侧选中文本组件，拖到画布中央，在右侧配置样式与数据源。
3. 选「HikariThings 定订阅」并绑定数据键
选中组件 → 右侧「数据」→ 选择 HikariThings 定订阅 → 选别名 → 添加数据键 → 订阅。
4. 用数据过滤脚本整理展示文案
订阅回来的结构可能是首次全量，也可能是后续增量更新。需要在「数据过滤」里加一段脚本，把温度抽出来显示。
示例（可按你的字段名调整）：
var list = (Array.isArray(data?.data?.data) && data.data.data.length)
? data.data.data
: (Array.isArray(data?.update) && data.update.length)
? data.update
: [];
if (!list.length) return '';
var item = list[0];
var name = '';
var temperature = '';
var isUpdate = Array.isArray(data?.update) && data.update.length > 0;
var latest = item.latest || {};
var ts = latest.TIME_SERIES || {};
if (ts.temperature && ts.temperature.value != null) {
temperature = String(ts.temperature.value);
}
// 仅首次订阅有 ENTITY_FIELD（name），更新时通常不填 name
if (!isUpdate) {
var fields = latest.ENTITY_FIELD || {};
if (fields.name && fields.name.value != null) name = fields.name.value;
}
return '温度：' + temperature;
保存后即可看到温度文案：
实时性：改 ThingsBoard 遥测，大屏跟着变
在 ThingsBoard 后台改该设备的温度遥测：
观察 GoView 大屏上的数值是否实时变化：
预览效果
加一点边框装饰后的预览：
再次修改温度：
数据随之更新：
不足之处（先说清楚）
我不是专业前端，虽然能借助 AI 实现不少能力，但精细体验仍有欠缺。当前已知问题包括：
- 别名 / 筛选器等数据源配置尚未做持久化保存——刷新页面后可能丢失；按理每个大屏的数据源都应保存并能正确回显。
- 数据链路侧想法已验证，保存 / 回显还没做完。
本文更像一份思路验证与踩坑笔记，欢迎参考，也欢迎一起完善。
小结
| 点 | 说明 |
|---|---|
| 动机 | TB 自带看板灵活，但国内大屏审美不够贴 |
| 方案 | 用开源 GoView 做展示层，对接 ThingsBoard 数据 |
| 关键 | 别名 + 定订阅 + 过滤脚本 + 实时遥测 |
| 现状 | 链路已跑通并开源；持久化等产品化工作仍待补 |
如果你也在用 ThingsBoard 做交付，又被「大屏不好看」卡住，这条路值得一试：平台能力继续用 TB，视觉层用更贴近国内习惯的大屏引擎。
相关阅读：