返回项目列表

Pulse 数据看板

为团队打造的实时数据监控看板:先统一指标口径,再谈可视化——一个「唯一事实来源」的搭建过程。

Pulse 数据看板
2025
数据可视化ReactTypeScript

为什么做这个

团队的数据散落在四五个系统里,每天早上都有人把截图贴到群里问「这个数字对吗」。

仔细观察会发现,「数字对吗」这个问题分两层:一层是数据没拉到(管道问题),另一层更隐蔽——同一个指标,两个系统的口径不一样。运营看的「活跃用户」和产品看的「活跃用户」根本不是同一个定义,截图对截图,永远对不上。

所以这个项目的目标从一开始就明确:不是再做一个看板,而是做唯一的事实来源。

三层结构:先语义,后展示

Pulse 的三层结构

fig. 指标语义层是整个系统的核心——口径只在这里定义一次

聚合层(Node.js):对接各业务系统的 API 和数据库只读副本,把原始数据拉齐到统一的时间粒度和维度。这一层只负责「拿到干净的数据」,不做任何业务解释。

指标语义层:每个指标在这里定义一次——计算公式、维度约束、刷新频率、负责人。下游所有展示都引用语义层的定义,不允许在看板里临时写计算逻辑。这是消灭「口径不一致」的唯一的办法:让歧义没有地方藏身。

展示层(React + ECharts):指标卡 + 趋势线 + 多维下钻。所有查询走缓存,看板打开即得,不等加载。

interface Metric {
  key: string;
  label: string;
  value: number;
  trend: number[]; // 最近 30 天
  definition: string; // 口径说明,hover 可见
  owner: string; // 口径负责人
}

告警:让看板主动说话

只看板的系统是被动的——没人看的时候,异常就躺在那里。Pulse 加了一层告警:阈值规则和环比突变检测跑在聚合层上,命中即推送到群里,带上指标的口径说明和最近 24 小时的曲线。

结果

上线三个月后,群里的「数字对吗」基本消失了。告警功能还帮我们提前发现了两次数据管道故障——都是凌晨触发,值班同学在用户还没上班之前就修好了。

体会

数据产品最常见的误区是把精力花在图表好不好看上。这个项目让我确认了一件事:看板的价值 = 口径的可信度 × 打开的频率。前者靠语义层,后者靠速度和告警——图表美观度排在这两者之后。