← 所有版型

象形占比 <Pictogram />

左边是结论和图例,右边 10 个大格或 10×10 的小格,按比例从第一格起依次涂色,最多三种颜色。

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

在範例簡報中查看 →

分組
数据 · “每 N 个里有几个”
元件
Pictogram · #pictogram

適合

  • 比例换成“每 10 / 100 个里有几个”更好懂
  • 一到三个部分

不適合

  • 精确到小数的比例:用 ShareBar
  • 部分超过 3 个:用 Donut

內容上限

1title ≤ 2 行 × 12 字
2parts 1–3 个:label ≤ 10 字
3各部分之和 ≤ of
4rest ≤ 10 字

欄位

欄位型別
kicker · 必填string小标签
title · 必填string | string[]结论
leadstring导语
of · 必填10 | 100格数
parts · 必填{ label, value }[]涂色部分
reststring未涂色部分的名字
iconIconName每格的图标
sourcestring出处

範例程式碼

<Pictogram
  kicker="页面类型"
  title={['每 100 页里,', '23 页逐条展开']}
  of={100}
  parts={[{ label: '逐条展开', value: 23 }, { label: '深色或强调色整页', value: 9 }]}
  rest="静态浅色页"
  source="…"
/>