图示
DataflowFigure 数据流图
一条管线:数据从哪来、经过了什么、最后落到谁手里。
来自@misoto22/design/diagrams
什么时候用它
结构上跟架构图很像,读的却是另一个问题。classification 单独占一个标签,因为做治理审查的人找的正是那一项。
示例
default
Event pipeline
4 elements and 3 relationships. What is in the arrow matters more than the arrow.
- Web SDK (frontend) — browser
- Mobile (frontend) — iOS / Android
- Consent gate (security) — policy filter
- Warehouse (database) — analytics tables
- Web SDK → Consent gate: clickstream — user events
- Mobile → Consent gate: app events — device events
- Consent gate → Warehouse: accepted — no PII
Key
说明
一条管线:数据从哪来、经过了什么、最后落到谁手里。
结构上跟架构图很像,读的却完全是另一个问题——所以它是一个独立的渲染器而不是一个预设。架构图读的是「谁跟谁说话」。数据流图读的是「这根箭头里装的是什么」——正是这个问题,让 classification 在标签下面单独拿到一枚等宽小标,而不是被揉进措辞里。clickstream / PII touch 和 clickstream 是两个不同的事实,而做治理审查的人找的是后面那个。
阶段印成顶部一条线上的列标题。它们是这张图的坐标轴:一个节点的 stage 就是它在管线上的位置,读者应该靠往上看、而不是靠追箭头,来回答「这走到哪一步了」。
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| spec必填 | DataflowSpec | — |
同时接受 FigureChrome 里的全部属性,它们会直接透传给底层元素,不再逐条列出。
无障碍
- 一条流的 classification 会并进它的摘要行,所以「clickstream — PII touch」能传达给看不到那枚标签的人。