← 所有版型

迷你走势卡 <SparkCards />

每张卡一个大数字、一个变化胶囊和一条小折线(带面积,终点一个圆点),底部注明周期。

版型與風格的說明目前僅提供簡體中文。

在範例簡報中查看 →

分組
数据 · 3–4 个指标各带走势
元件
SparkCards · #spark-cards

適合

  • 3–4 个指标,每个都有一串历史值
  • 既要看现在也要看走势

不適合

  • 只看一个指标的趋势:用 LineChart
  • 没有历史值:用 StatRow

內容上限

1cards 3–4 张:label ≤ 10 字,value ≤ 7 字符,series 4–32 个点,note ≤ 12 字

欄位

欄位型別
kicker · 必填string小节名,2–8 字
title · 必填string | string[]标题;数组手动断行
leadstring一两句导语,≤ 60 字
sourcestring事实出处
cards · 必填{ label, value, unit?, delta?, series, note? }[]卡片

範例程式碼

<SparkCards
  kicker="文字密度"
  title="每页写多少字,起伏比平均数重要"
  cards={[{ label: 'Lumen 解读', value: '101', unit: '字/页', series: [74, 115, 52, …], note: '25 页' }, …]}
  source="…"
/>