组态图 + ThingsBoard 搭建可视化数据大屏
项目名称：
meta2d-thingsboard-designer
GitHub 地址：https://github.com/TheXiong/meta2d-thingsboard-designer
🌟 为什么需要“组态 + ThingsBoard”？
- ThingsBoard是一个开源的 IoT 平台，擅长设备接入、规则引擎和数据存储；
- 传统组态软件功能强大但开发复杂、学习成本高；
- meta2d-thingsboard-designer 组态设计器融合两者优势：
- ✅ 拖拽式搭建
- ✅ 无缝对接 ThingsBoard
- ✅ 支持多源数据
→ 实现低代码构建专业级 IoT 数据大屏！
meta2d-thingsboard-designer 正是为此而生——
它不仅支持实时数据展示，更内置强大的数据联动与事件处理引擎，让大屏真正“活”起来！
设计器大屏演示
🎨 核心功能亮点
1. 可视化拖拽设计器
- 丰富组件库：
- 基础：文本、数字、图片、图标
- 输入：开关、滑块、下拉框
- 图表：折线图、柱状图、仪表盘、地图
- 高级：事件日志、动画路径、拓扑连线
- 工业级组态图形：
- 支持电力、水务、制造、楼宇等场景模板
- 可在地图上标注设备位置，用连线表示通信关系
- 支持动态路径动画（如物流轨迹、数据流向）
2. 多数据源支持
数据源类型说明
✅ ThingsBoard
✅ HTTP
✅ MQQT
✅ WebScoket
3.Thingsboard数据对接截图
screenshot_2025-12-10_10-57-48
💡 示例：将thingsboard的遥测数据通过webscoket订阅到仪表盘中，遥测数据更新，图表数据实时更新
4. 数据联动 & 事件处理（核心引擎）
meta2d-thingsboard-designer 的核心优势在于将静态大屏升级为智能交互系统。通过内置的可视化事件引擎，无需编码即可实现：
🔗 数据驱动 UI 变化
- 组件样式、可见性、内容可绑定到任意数据字段
- 示例：
- 当
temperature > 30→ 仪表盘背景变红 - 当
status === "offline"→ 设备图标置灰 + 显示 ❌
- 当
🛎️ 智能告警与通知
- 支持多级阈值告警（警告/严重）
- 触发动作包括：
- 弹出消息提示框
- 播放提示音
- 高亮闪烁组件
- 自动记录到日志面板
🖱️ 用户交互触发控制
- 点击、悬停、双击等操作可绑定业务逻辑
- 典型场景：
- 点击水泵图标 → 弹出“启停控制”对话框
- 拖动滑块 → 实时调节设备参数（通过 RPC 下发）
📤 双向指令下发（ThingsBoard RPC）
- 通过数据的变更自动给设备下发命令
- 手动支持向设备发送同步/异步 RPC 命令
- 配置方式：
{"method":"setValveState","params":{"open":true}}
5. 响应式 & 多端适配
- 自动适配 PC、平板、大屏、移动端
- 支持 4K 分辨率，满足指挥中心需求
- 提供多种 UI 主题：科技蓝、深空灰、极简白
- 支持自定义主题色、边框、阴影、渐变
📌技术标签：#数据可视化#大屏设计#ThingsBoard#Meta2D#Vue3#低代码#工业组态#IoT#前端开发
