3、仪表盘基础概念：仪表盘、部件、数据源、别名、状态、仪表盘配置界面
好，咱们今天聊聊 ThingsBoard 仪表盘里最核心的几个概念。说实话，我刚接触 ThingsBoard 那会儿，也被这些名词绕得有点晕。什么仪表盘、部件、数据源、别名、状态……感觉每个词都认识，但凑在一起就不知道谁是谁了。
别急，咱们一个一个捋清楚。搞懂了这些，你后面做任何复杂的仪表盘都会顺手很多。
3.1 仪表盘（Dashboard）—— 你的“画板”
仪表盘，说白了就是一个容器。它就像你手里的画板，上面可以贴各种图表、按钮、表格。你想想看，一个工厂的监控大屏，或者一个智能家居的控制面板，本质上都是一个仪表盘。
我个人习惯把仪表盘分成两类：
- 实体仪表盘：绑定到某个具体设备或资产，比如“1号锅炉监控”。
- 分组仪表盘：展示一组设备的汇总数据，比如“全厂设备健康度总览”。
嗯，这里要注意：一个仪表盘可以包含多个页面（Tabs），每个页面又可以放不同的部件。我在项目中遇到过客户要求一个仪表盘里放 20 多个页面，结果加载慢得不行。后来我建议他们拆成多个仪表盘，用导航链接跳转，体验好多了。
3.2 部件（Widget）—— 你的“积木”
部件就是仪表盘上的一个个小模块。温度计、折线图、开关按钮、数据表格……这些都是部件。ThingsBoard 自带了 100 多种部件，但说实话，很多时候你还是要自己写。
部件分三种类型：
- 基础部件：显示单个值，比如一个数字、一个开关状态。
- 图表部件：展示历史数据趋势，比如折线图、柱状图。
- 卡片部件：组合展示多个信息，比如设备详情卡片。
我记得有一次，客户想要一个“圆形进度条”，但 ThingsBoard 自带的部件里没有。怎么办？自己写一个呗。用 HTML + CSS + JavaScript，半小时搞定。所以，别怕写部件，它其实就是个前端组件。
3.3 数据源（Datasource）—— 你的“水管”
数据源，就是部件获取数据的通道。你想想看，一个温度计部件，它怎么知道显示哪个设备的温度？就是通过数据源告诉它的。
数据源有两种：
- 实体数据源：从某个设备或资产获取最新数据。比如“设备 A 的当前温度”。
- 历史数据源：从数据库里查询一段时间内的数据。比如“设备 A 过去 24 小时的温度变化”。
配置数据源时，你需要指定：
- 类型：实体还是历史？
- 别名：指向哪个设备？
- 键（Key）：读取哪个属性或遥测数据？比如
temperature、humidity。
说白了，数据源就是告诉部件：“嘿，你去这个设备，拿这个数据过来显示。”
3.4 别名（Alias）—— 你的“快捷方式”
别名这个概念，我刚开始也觉得有点多余。但用久了才发现，它真的太重要了。
别名，就是一个指向实体的“快捷方式”。比如你有一个设备叫 boiler_001，它的 ID 是一长串 UUID。你每次配置部件时，都要输入这串 ID？太麻烦了。而且万一设备换了，你还要改所有部件的数据源。
有了别名，你只需要在仪表盘级别定义一个别名，比如叫 当前锅炉，指向 boiler_001。然后所有部件的数据源都引用这个别名。哪天设备换了，你只需要改别名指向，所有部件自动更新。
别名的解析方式有几种：
| 解析方式 | 说明 | 适用场景 |
|---|---|---|
| 单个实体 | 直接指定一个设备或资产 | 固定设备监控 |
| 实体列表 | 指定一组设备 | 批量设备对比 |
| 实体组 | 按分组动态获取 | 动态设备列表 |
| 关系查询 | 根据设备关系链查找 | 资产树、父子设备 |
我个人最喜欢用“关系查询”。比如我有一个“车间”资产，下面挂了 10 台设备。我只需要定义一个别名，解析方式选“关系查询”，指定从“车间”出发，查找“包含”关系的设备。这样车间里新增设备时，仪表盘自动就显示出来了，不用手动改任何配置。
3.5 状态（State）—— 你的“页面切换器”
状态，其实就是仪表盘的“页面”。一个仪表盘可以有多个状态，每个状态对应一个不同的视图。
比如你做一个“工厂监控”仪表盘：
- 状态 1：总览 —— 显示全厂设备概览。
- 状态 2：设备详情 —— 点击某个设备后，跳转到这个状态，显示该设备的详细数据。
- 状态 3：报警列表 —— 显示所有报警信息。
状态之间可以互相跳转。怎么跳？通过部件里的“动作（Action）”来配置。比如点击一个设备卡片，触发“导航到状态”，跳转到设备详情页。
嗯，这里有个坑：状态跳转时，可以传递参数。比如从总览页点击设备 A，跳转到详情页时，要把设备 A 的 ID 传过去。否则详情页不知道要显示哪个设备的数据。
overview、detail、alerts。因为状态名称会出现在 URL 里，中文容易出编码问题。我曾经吃过这个亏，调试了半天才发现是中文路径的问题。
3.6 仪表盘配置界面 —— 你的“工作台”
最后，咱们看看仪表盘的配置界面长什么样。你打开一个仪表盘，点击右上角的“编辑”按钮，就进入了配置模式。
配置界面主要分几个区域：
- 工具栏：在顶部，可以添加部件、管理别名、设置仪表盘属性。
- 画布区：中间的大区域，就是你拖拽部件的地方。
- 部件库：左侧或右侧，列出了所有可用的部件类型。
- 属性面板：点击某个部件后，右侧会弹出这个部件的属性设置面板。
配置仪表盘时，我建议你按这个顺序来：
- 先定义别名 —— 把要用到的设备都配好别名。
- 再添加部件 —— 从部件库拖拽到画布上。
- 然后配置数据源 —— 让部件引用别名和数据键。
- 最后调样式 —— 大小、颜色、布局，慢慢调。
别一上来就调样式。我见过很多新手，花半小时调颜色，结果数据源配错了，图表一片空白。先让数据跑通，再美化，这是铁律。
好了，以上就是仪表盘的几个核心概念。你想想看，其实它们之间的关系很简单：
仪表盘 是画板，部件 是积木，数据源 是水管，别名 是快捷方式，状态 是页面切换器。搞懂了这些，你就可以开始动手做第一个仪表盘了。
下一章，我会带你一步步创建一个真实的仪表盘，从零开始，把今天学的概念都用上。到时候你会发现，原来 ThingsBoard 也没那么神秘。