1. 课程导论与看板设计思维
1.1 KPI 看板的价值
在数据驱动的业务环境中，KPI（关键绩效指标）看板是连接原始数据与决策者的核心桥梁。它通过可视化方式将复杂的 SQL 查询结果转化为直观的图表，帮助团队快速掌握业务健康度。
| 价值维度 | 说明 | 典型场景 |
|---|---|---|
| 实时监控 | 通过定时刷新的 SQL 查询，将最新数据呈现在看板上 | 日活用户（DAU）、销售额实时看板 |
| 异常预警 | 设定阈值，当指标偏离正常范围时自动高亮 | 转化率骤降、库存告警 |
| 趋势分析 | 利用历史数据绘制折线图，发现增长或衰退规律 | 月度营收趋势、用户留存曲线 |
| 归因定位 | 通过下钻交互，从总体指标定位到具体维度 | 按渠道、地区、产品线拆分销售额 |
课程提示： 本课程将使用 MySQL 作为数据源，ECharts 5.x 作为图表渲染引擎。所有看板均基于真实业务 SQL 查询构建，避免使用模拟数据。
1.2 数据驱动决策的闭环
KPI 看板不是简单的图表堆砌，而是数据驱动决策流程中的可视化输出环节。完整的闭环包括以下四个阶段：
- 数据采集：通过 SQL 从业务数据库提取原始数据。
- 指标计算：使用聚合函数、窗口函数等计算 KPI。
- 可视化呈现：将计算结果映射为 ECharts 图表。
- 决策行动：基于看板洞察采取业务动作。
1.3 看板设计三大原则
优秀的 KPI 看板需要遵循以下设计原则，确保信息传递高效、无歧义：
1.3.1 KISS 原则（Keep It Simple, Stupid）
- 指标精简：单屏看板核心指标不超过 7±2 个，避免信息过载。
- 图表简洁：优先使用柱状图、折线图、仪表盘等基础图表，避免 3D 或复杂雷达图。
- 操作极简：用户无需培训即可理解看板含义，点击下钻不超过 2 层。
1.3.2 一致性原则
- 视觉一致性：同一看板内使用统一的配色方案、字体、图表风格。
- 指标口径一致：同一 KPI 在不同图表中的计算逻辑必须相同，避免歧义。
- 交互一致性：所有可点击元素使用相同的悬停效果和点击反馈。
1.3.3 层级原则
看板信息应按照“总览 → 细分 → 明细”的层级组织：
| 层级 | 内容 | 图表类型示例 | SQL 粒度 |
|---|---|---|---|
| L1 总览层 | 核心 KPI 数字、整体趋势 | KPI 卡片、仪表盘、折线图 | 全量聚合（SUM/COUNT） |
| L2 分析层 | 按维度拆解、对比分析 | 分组柱状图、堆叠图、饼图 | GROUP BY 维度 |
| L3 明细层 | 原始数据列表、异常详情 | 表格、散点图 | 原始行数据（LIMIT 分页） |
实战要点： 在构建看板前，先用纸笔或思维导图画出层级结构。确定每个层级需要回答的业务问题，再反向推导 SQL 查询和图表类型。避免“先画图表，再想指标”的错误顺序。
1.4 本课程的技术栈与学习路径
本课程将围绕以下技术栈展开，每个章节均包含可运行的 SQL 代码和 ECharts 配置：
| 技术组件 | 版本 | 用途 |
|---|---|---|
| MySQL | 8.0+ | 数据存储与查询（窗口函数、CTE） |
| ECharts | 5.4+ | 图表渲染与交互（下钻、联动） |
| HTML/CSS/JS | ES6+ | 看板页面布局与数据绑定 |
| Node.js (可选) | 18+ | 本地 API 服务，模拟后端数据接口 |
避坑提醒： 不要试图在一个看板中展示所有指标。遵循“一个看板解决一个业务问题”的原则。例如：销售看板只关注营收、订单量、客单价；运营看板只关注 DAU、留存、转化率。指标混杂会导致看板失去焦点。
1.5 看板设计思维总结
KPI 看板的核心价值在于将 SQL 查询结果转化为可行动的洞察。设计时需牢记：
- 业务驱动：先明确业务问题，再设计指标和图表。
- 数据准确：SQL 查询的正确性是一切可视化的基础。
- 视觉高效：遵循 KISS、一致性、层级原则，让信息一目了然。
- 迭代优化：看板不是一次性交付物，需要根据业务变化持续调整。