数据可视化大屏是企业数字化管理的驾驶舱。本文基于山河网络 SH-DV 产品的设计经验，分享从需求到落地的 7 个关键步骤。
一、需求分析（最重要的一步）
- 明确受众：高管（战略指标）/ 中层（运营指标）/ 一线（执行指标）
- 确定场景：会议室大屏 / 展厅展示 / 移动端查看
- 梳理指标：不超过 12 个核心指标，避免信息过载
二、指标设计
好的指标具备四个特征：可量化、可对比、可行动、有时效。常用指标体系：
- 经营类：营收、利润、增长率
- 运营类：转化率、复购率、客单价
- 效率类：人效、坪效、库存周转
三、数据架构
- 数据源：业务数据库 / 日志 / API / Excel
- ETL：定时抽取 + 增量同步 + 数据清洗
- 存储：MySQL（明细）+ Redis（缓存）+ ClickHouse（分析）
四、视觉设计原则
- 配色：深色背景 + 高饱和度强调色，适合大屏长时间观看
- 布局：F 型视线热区，关键指标放左上
- 图表：KPI 用数字卡片，趋势用折线，占比用饼图/环图，排名用条形
五、技术选型
| 方案 | 适用场景 | 性能 |
|---|---|---|
| ECharts | 通用图表，生态丰富 | 中等 |
| D3.js | 定制可视化 | 高（需优化） |
| Three.js | 3D 场景 | 高（需 GPU） |
六、交互设计
- 下钻：从汇总到明细的逐层展开
- 联动：选择时间范围，全屏图表同步更新
- 告警：异常指标红色闪烁 + 推送通知
七、性能优化
- 数据分页加载，首屏小于 3 秒
- WebSocket 实时推送关键指标
- 图表懒加载，非可视区域不渲染