← 所有版型

数字滚轮 <Odometer />

1–3 个大数字,每一位像里程表一样滚到终值;数字下有标签和一行说明。DOM 里始终是真实的终值文字,滚轮只是叠在上面的装饰。

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

在範例簡報中查看 →

分組
数据 · 1–3 个大数字
元件
Odometer · #odometer
互動
每个数字是一个 build 步骤,出现时滚动到终值

適合

  • 少数几个需要“数出来”的大数字
  • 距离、人数、时长这类量级数字

不適合

  • 数字之间要比较大小:用 BarChart
  • 超过 3 个数字:用 StatRow

內容上限

1title ≤ 18 字
2stats 1–3 个:value ≤ 7 个字符,unit ≤ 4 个字符,label ≤ 12 字,note ≤ 28 字

欄位

欄位型別
kicker · 必填string小节名,2–8 字
title · 必填string | string[]标题
stats · 必填{ value, unit?, label, note? }[]数字
sourcestring事实出处

範例程式碼

<Odometer kicker="三个数字" title="远、久、看的人多" stats={[{ value: '384,400', unit: 'km', label: '地月平均距离' }, …]} />