分析与图表模块

本页是全部十三种图表与 KPI 模块的快速概览 —— 每一种也都有自己独立的详细页面,包含完整的字段列表和实例演示,链接列在各自小节末尾。

十三种图表与 KPI 模块,用于在邮件内部直接讲述数据故事 —— 周报摘要、销售业绩回顾、一份收件人无需点击跳转就能阅读的报告。它们与其他所有模块位于插入面板同一个内容分区中;并没有单独的"分析"分类。

以下几点对这个家族中的每一种图表都成立,因此在这里统一说明一次,而不是在下面重复十三遍:

**每个图表都渲染为一张服务器端生成的单一图片 —— 没有客户端图表库,没有 JavaScript —— 旁边总是紧跟一张可见的数据表格。**这张表格不是脚注,也不是事后补上的无障碍功能:它呈现的正是与图片相同的数字,以纯 HTML 形式给出,也正是它让图表在纯文本客户端、屏蔽图片的收件箱以及屏幕阅读器中真正可用。它永远不是可选项。
图表的数字在发送或导出时就已固定 —— 与倒计时的截止时间或商品模块的库存徽章遵循同样的"以发送时为准"的约定,而不是一个实时更新的组件。(唯一的例外:绑定到某次营销活动自身响应结果的图表会在渲染时读取实时数据 —— 参见将图表绑定到真实数据。)
**绝不使用双坐标轴图表。**两个量级不同的指标应该是并排的两个图表模块,而不是一个假装拥有两条 Y 轴的图表。

KPI 计分卡

一个突出显示的大数字,用于展示头条指标 —— 收入、注册量,或邮件所报告的任何内容。

字段: 一个标签、一个带格式的数值(纯数字、货币或百分比)、一个可选的用于展示 Δ 差值的历史值,以及一个可选的迷你趋势图。
Δ 的方向(上升/下降/持平)由你自己设定,而不是根据数字是否上升来自动推断 —— 这样你可以自己掌控什么才算好消息。
迷你趋势图是一张小型趋势图片;其下方的标签/数值/Δ 始终是真实的 HTML 文本,不依赖图片是否成功渲染。

→ 完整指南与示例

柱状图

垂直或水平的柱形图,最多支持 3 个手动输入的系列。

超过大约 8 个类别之后,图表会放弃在每根柱子上直接标注数值,转而使用带网格线的共享坐标轴 —— 在十几根带标签的柱子上读取精确数字,在此之前就已经变得难以辨认,因此数据表格会接管成为精确的数据来源。

→ 完整指南与示例

折线图/面积图

与柱状图相同的逐行录入方式 —— 类别列在行中,最多 3 个系列列在列中 —— 再加上一个用于面积图变体的 filled 开关。

每个数据点上的点标记在大约超过 20 个点之后开始逐渐减少,以免折线变成一整排实心圆点;此后描边的线条、共享坐标轴和数据表格仍会继续呈现趋势。

→ 完整指南与示例

饼图/环形图

每个类别对应一个数值,绘制为一个饼图,或(在环形模式下)一个带有可选中心标签的圆环,可在中间显示一个 KPI 风格的数字。

超过 8 个扇区之后,最小的几个扇区会合并为一个单独的"其他"扇区,而不是让图表变得细小到难以辨认 —— 图例和数据表格都会展示同样的合并结果。

→ 完整指南与示例

散点图/气泡图

X/Y 坐标点,配有一个可选的 series 列用于将点分组为多种颜色,以及一个可选的 size 列用于将其变为气泡图。

系列的归属由你在"系列"列中输入的内容决定 —— 留空的话,每个点都会共用该模块自己的标题作为唯一系列。

→ 完整指南与示例

直方图

自动将一列原始数值分箱为若干区间 —— 交给它的是单个数值,而不是已经计数好的分组,分箱工作由它自己完成。

你可以大致控制目标分箱数量;如果你输入的所有数值都完全相同,它会合并为一个分箱,而不是绘制十九个空分箱。

→ 完整指南与示例

热力图

一个行 × 列的数值网格,按从浅到深的顺序色阶着色。

只要网格保持在一眼能看清的大小范围内,单元格就会以文本形式显示其精确数值 —— 超过这个范围后,色阶本身(加上始终可见的数据表格)会承担呈现数字的任务,而不是把文字硬塞进微小的单元格里。真正缺失的组合(某个行/列配对完全没有对应的行数据)会渲染为一种独特的"无数据"灰色,而不是看起来像是零。

→ 完整指南与示例

漏斗图

按顺序排列的阶段数值 —— 访问 → 注册 → 购买,诸如此类的序列 —— 每个阶段都显示为第一阶段的百分比。

由于漏斗图的含义完全取决于你输入各阶段的顺序,因此不能像饼图/矩形树图那样把溢出的阶段合并进一个"其他"分组 —— 超出上限的阶段会被直接不予绘制。数据表格会同时给出"占第一阶段的百分比"和"占上一阶段的百分比"(逐级流失率),这是仅看图片无法体现的。

→ 完整指南与示例

瀑布图

一种累计总额图表 —— 起始值,然后是一系列增加/减少的柱子,可以选择在中途或末尾落在一根手动输入的"合计"柱上。

增加/减少/合计柱始终使用同样的三种保留颜色,因此瀑布图在每封邮件中都能保持一致的观感,而不是取决于你上一次随手选的颜色。与漏斗图一样,溢出的柱子会被直接丢弃而不是合并,因为累计总额的计算依赖于手动输入的顺序。

→ 完整指南与示例

仪表图

将单一指标与你定义的良好/警告/严重阈值区间进行对比展示 —— 一种指针式表盘,而不是基于行数据的图表。

这是该图表家族中唯一没有底部数据表格的模块,原因与 KPI 计分卡相同:数值及其状态本身已经是图片旁边真实的 HTML 文本,而不是被锁在图片里的数字。

→ 完整指南与示例

雷达图

一种多轴对比 —— 最多 3 个系列绘制在共享坐标轴上,适合同时在多个维度上比较各个类别(例如按价格/质量/速度/支持对一款产品评分)。

至少需要 3 条轴才能绘制成多边形 —— 少于这个数量会显示与空图表相同的"添加更多数据"占位提示。与该家族中其他图表不同,这既是下限也是上限(最多支持 8 条轴)。

→ 完整指南与示例

矩形树图

按数值大小成比例排布的方块,以填满一个矩形的方式布局("方块化"布局),而不是像饼图那样用角度表示 —— 与饼图相同的每类别一个数值的录入方式,只是用另一种形状来比较各部分占整体的份额。

遵循与饼图相同的"超过 8 个部分即合并"的规则,因为两者共用同一套底层数据处理逻辑。

→ 完整指南与示例

桑基图

在具名节点之间成比例流动的关系 —— 由"起点""终点"和"数值"组成的行,例如流量来源 → 落地页 → 转化。

节点不是直接手动输入的;它们是从你在"起点/终点"行中反复出现的标签推导得出的,其从左到右的位置也是根据流动方向自动计算的。
超过节点或连接数上限时,溢出的节点会被直接丢弃,而不是合并 —— 把两个不同的流动端点合并为一个,会歪曲图表所要展示的内容,这一点不同于饼图的"其他"扇区做法。无论某一行是否最终出现在绘制出的图表中,数据表格都会照常列出你输入的每一行,因此你输入的内容不会被悄悄隐去。

→ 完整指南与示例

绑定到真实数据

KPI 计分卡、柱状图、折线图和饼图 —— 仅限这四种 —— 可以绑定到已连接的数据源或某次过往营销活动自身的响应结果,而不必使用你手动输入的数字。此外还有一个一键式的仪表盘项目起始模板,可以一并生成一行 KPI 卡片和一个柱状图。参见将图表绑定到真实数据了解具体方法。