濃いマスほど、このテーマでその指標が高いことを示します。
明瞭68
説得80
密度78
制作コスト70
課題適合55
仕事適合86
低高
短い答え
サンキーフローのストーリーはいつ選ぶ？
次の条件に合う。予算配分、変換経路、物質またはエネルギーの流れ
いつ避ける？
次の場合は別の形にする。視聴者に必要なのは開始と終了のウォーターフォールだけです
誰が作り、広めた？
マシュー・ヘンリー・フィニアス・リアル・サンキー（1898年）。最新の d3-sankey レイアウト
何を符号化する？
リンク幅はノード間のフローに比例します
広告に使ってよいか？
Yahoo・LINE・Meta素材で主張が一目なら可。難しければランディングに図を置く。
課題に使えるか？
実験レポートとポスターで軸・単位・出典があれば通る。
サンキーフローのストーリーはリンク幅はノード間のフローに比例しますとして値を載せます。マシュー・ヘンリー・フィニアス・リアル・サンキー（1898年）。最新の d3-sankey レイアウト。
業務報告・広告・課題では「予算配分、変換経路、物質またはエネルギーの流れ」に向く。「視聴者に必要なのは開始と終了のウォーターフォールだけです」のときは別の形を選ぶ。
ソフト
- d3-sankey — サンキー図のレイアウト アルゴリズム - BSD-3-Clause。 · BSD-3-Clause · github.com/d3/d3-sankey
- ECharts sankey — 電池付属のダッシュボード用Sankeyシリーズ。 · Apache-2.0 · github.com/apache/echarts
- Plotly.js — 分析アプリ用の Sankey トレースが含まれています。 · MIT · github.com/plotly/plotly.js
- Mermaid flowchart — インタラクションが不要な場合のテキストによる代替。 · MIT · github.com/mermaid-js/mermaid
- Funnel twin — サンキーが過剰な場合のステージ幅をシンプルにします。 · CC0 examples · github.com/Tool-Lifes/viz-atlas
書き出し
- 書き出し 1 — SVG
- 書き出し 2 — PDF
- 書き出し 3 — スライドへ EMF/SVG（スクリーンショット禁止）
- 書き出し 4 — ウェブはSVG、印刷はPDF
アクセシビリティ
- アクセシビリティ 1 — 色だけに意味を持たせない。パターン・ラベル・位置を重ねる。
- アクセシビリティ 2 — 本文は 4.5:1、大きなマークは 3:1。
- アクセシビリティ 3 — チャートに短い代替テキスト。数値はHTML表でも。
- アクセシビリティ 4 — 動きは強調のときだけ。prefers-reduced-motion を尊重。
サンキーフローのストーリー: リンク幅はノード間のフローに比例しますを守り、「視聴者に必要なのは開始と終了のウォーターフォールだけです」のときは別の図を選ぶ。