折线竞速图

概述

“Line race” 图会在时间轴上为多条序列做动画，突出它们的相对位置和值如何变化。随着年份推移，线条随收入上升或下降，呈现经济竞争与增长模式的动态画面。这种方式让历史数据更生动，便于发现领跑者、后起之秀和排名的剧烈转折。

何时使用

• 展示国家或地区经济指标的竞争演变
• 揭示长期内相对表现的剧烈变化
• 用历史趋势讲述引人入胜的故事
• 突出几十年间的领先者与落后者
• 呈现收入不平等或收敛
• 让长周期数据更易被记住

不适用

• 只需静态比较的故事
• 观众希望自行控制节奏的场景
• 精确数值比相对位置更重要的情境
• 无法播放动画的印刷或静态媒介
• 同时超过 10 条系列（会混乱）

关键变体

• 动画速度（每十年 2–10 秒）
• 末端标签显示各系列的值
• 平滑曲线 vs 直线段
• 突出当前领跑者
• 交互控制用于播放或探索

使用场景

• 自 1950 年起的欧洲各国收入演变
• 不同年代的人均 GDP 排名
• 经济收敛/发散的区域对比
• 按行业比较收入增长
• 各国的技术采纳率
• 各国寿命提升

数据 (CSV)

Year,Finland,France,Germany,Iceland,Norway,Poland,Russia,United Kingdom
1950,8200,9500,7100,10500,11200,5400,6100,9800
...
2020,36900,40200,42100,44800,49800,30100,28300,38100

图表配置 (JSON)

设计提示

• 为每个国家使用独特颜色，并在动画全程保持一致
• 打开末端标签以显示排名和最终数值
• 70 年跨度建议设为 8–12 秒
• 保持 smooth: false 以尊重历史观测
• 在右侧预留 120–150 px 放置末端标签
• 可启用悬停强调以便逐条查看

性能提示

• 控制在 5–8 条系列以内以保持清晰
• 若时间点超过 50 个，可每 5 年抽样一次
• 使用 showPoints: false 改善渲染
• 根据受众调节动画速度；过快会让人困惑

常见问题

动画节奏多少合适？ 对几十年数据，8–12 秒总长较合适（约 0.15–0.2 秒/年）；周期短时 3–5 秒即可。

末端标签如何工作？ 它们显示在右侧，带有名称和最终值，无需依赖图例就能看到最终排名。

需要一次显示所有线吗？ 需要，竞速效果取决于同时呈现。若超过 8 条，考虑只展示前 5 条并加一条对比线。

线条交叉很多怎么办？ 这会增加视觉趣味。使用高区分度的颜色，并启用悬停强调以方便跟踪特定系列。

可以暂停或重播吗？ 虽然此配置写在 Markdown 中，大多数图表库都能通过事件添加播放/暂停或重置按钮。

数值差距太大怎么办？ 如果某条线是另一条的 10 倍，可改用对数轴或展示增长率（%）；也可把故事拆成多个阶段或刻度。