折线图:编辑式图表与布局语法指南

展示有序区间内的变化,不虚构连续性。

何时选择这种图表

展示有序区间内的变化,不虚构连续性。 当这正是读者需要回答的问题时,适合选择此语法。先确定范围和受众,再增加细节;如果真正关心的是归属、时序或数量,应先与目录中相邻的图表类型比较。

如何组织布局

保持区间刻度一致并标轴,缺失观测留空,不用平滑曲线暗示未经证实的中间值。

输入中需要准备什么

提供有序时间或位置、观测值和单位,说明不规则采样,区分测量与预测。 输入应具体,分享前对照这些事实审核生成结果。

Diagram Design 的六项编辑原则与几何规则

4px 网格规则
节点坐标、宽高和圆角使用四的整数倍。共享网格让各层对齐、标签留白可预测,也让手动微调继续保持一致。
正交连线与 r=8 圆角
架构和流程图中,不共轴的连接采用横竖线段与 8px 圆角,避免箭头穿过标签。桑基图、极坐标图等定量图形保留数据表达必需的曲线。
单一强调色视觉焦点
用主要决策、集成点或瓶颈确定视觉重点,将珊瑚色留给这个故事,其余组件保持克制。移除颜色后,标签和形状仍应保留含义。
五种语义颜色变量
--paper 表示画布,--ink 表示正文,--muted 表示注释,--soft 表示轻边界,--accent 表示重点。更换品牌配色时,各自的语义职责保持稳定。
Instrument Serif + Geist 字体系统
编辑式标题使用 Instrument Serif,组件名称使用 Geist,技术注释使用 Geist Mono。通过文字职责区分故事与实现细节,无需增加装饰。
WCAG AA 品牌配色提取
输入公开品牌网址,提取五种语义颜色。提取器检查主文字 ink 与画布 paper 的对比度是否至少为 4.5:1,不足时修正这对颜色;整张图的可访问性仍需单独检查。