开发预览 更新于 2026-05-10

VennDiagram 韦恩图

2 集合 / 3 集合重叠图 —— 用户群交叉、标签共现、A/B 测试覆盖,圆面积按 count 缩放。

基础用法

sets 接 2 个或 3 个集合,圆面积按 count 缩放。intersections 数组指定交集区域的 count,组件用半混合(mix-blend-mode: multiply)展示重叠色块。

背景 视口

API

Prop类型默认说明
sets{ label, count, color? }[]2 或 3 个集合
intersections{ sets: number[], count, label? }[]交集数据(按 set index)
sizenumber320SVG 边长
format(n) => string计数格式化
ariaLabelstringSR 描述
variant'sm' | 'md' | 'lg''md'字号档位

事件 payload:{ type: 'set' | 'intersection', setIndex?, set?, intersection? }

注:组件渲染的”仅在 set i”标签 = sets[i].count − Σ(包含 i 的所有 intersections)。如果你的数据里已经包含重叠值,需自行减去。

反馈与讨论

VennDiagram 韦恩图 的讨论

0
0 / 600
正在加载评论...