排名变化 <SlopeRank />

左右两列名次，中间连线：上升的线较深，焦点一条用强调色；右侧标出升降几位。

Template and style descriptions are currently available in Chinese only.

See it in the demo deck →

Group: 数据 · 两个时间点或两种口径的名次
Component: SlopeRank · #slope-rank

Good for

排名在两个时间点之间的变化
同一批对象按两种口径排名

Avoid when

要看具体数值：用 Dumbbell
超过 8 个对象

Content limits

1	periods 2 个，各 ≤ 8 字符
2	items 4–8 个：name ≤ 10 字
3	note ≤ 40 字

Fields

Field	Type
`kicker` · required	`string`	小节名，2–8 字
`title` · required	`string \| string[]`	标题；数组手动断行
`lead`	`string`	一两句导语，≤ 60 字
`source`	`string`	事实出处
`periods` · required	`[string, string]`	两列标题
`items` · required	`{ name, from, to }[]`	名次
`focus`	`string`	焦点对象
`note`	`string`	右侧结论

Example

<SlopeRank
  kicker="两种排名"
  title="按页数排第二，按模板种类排第一"
  periods={['按页数', '按模板种类']}
  items={[{ name: 'GEO 简报', from: 1, to: 2 }, { name: 'GTM 手册', from: 2, to: 1 }, …]}
  focus="GTM 手册"
  source="…"
/>