K_DM Book
用語集
対象者 標準
対象者別の入口 →

対象者の設定はこのブラウザの中にだけ保存されます。

言語 JA

サンキーダイアグラムでフロー分岐を把握

中級

06.7.25

サンキーダイアグラムでフロー分岐を把握

最終更新 2025-11-04 読了時間 2 分
まとめ
サンキーダイアグラムは、起点から複数の分岐先へ流れる量を帯の太さで表し、どの分岐で大きく減ったか、どの経路が太いかを一枚で見せる図です。ファネルチャートが 1 本の流れしか描けないのに対し、「流入 → 無料登録 → 有料化」と「流入 → 直帰」のように枝分かれする経路を同時に描けます。Plotly の go.Sankey は、ノードの名前のリストと、リンクごとの source（出発ノードの番号）・target（到着ノードの番号）・value（流量）の 3 つのリストを渡すだけで配置を自動計算し、ホバーで流量を確認できる HTML を出力します。読み終えると、流入 1,000 件のうち 420 件が無料登録に進み、そのうち 260 件が有料化する経路が最も太い帯になる理由を理解し、自分の遷移データを 3 つのリストに整えて描けるようになります。

直感 #

サイトに来た 1,000 人のうち 420 人が無料登録、280 人がカートで離脱、200 人が FAQ を見て、100 人が直帰したとします。さらに無料登録の 420 人は 260 人が有料化、100 人が再来訪、60 人が離脱に分かれます。この 2 段階の分岐を表で読むには足し算と引き算が要りますが、サンキーダイアグラムは人数をそのまま帯の太さにして左から右へ流します。太い帯が主要経路、細い帯が少数派で、ノードの左右の帯の太さの合計は必ず一致します（入った分だけ出ていく）。有料化のノードまで帯をたどれば、どの段で何人が別の経路へ逃げたかが読めます。

Python で描く #

次のコードは 8 つのノードと 7 本のリンクを定義し、go.Sankey でインタラクティブなフロー図を作ります。write_html でブラウザ共有用の HTML を、write_image でドキュメント用の静的 PNG を書き出します。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68

import plotly.graph_objects as go

labels = [
    "流入",
    "無料登録",
    "カート離脱",
    "FAQ閲覧",
    "直帰",
    "有料化",
    "再来訪",
    "離脱",
]

sources = [0, 0, 0, 0, 1, 1, 1]
targets = [1, 2, 3, 4, 5, 6, 7]
values = [420, 280, 200, 100, 260, 100, 60]

fig = go.Figure(
    data=[
        go.Sankey(
            arrangement="snap",
            node=dict(
                pad=18,
                thickness=18,
                line=dict(color="rgba(0,0,0,0.2)", width=1),
                label=labels,
                color=[
                    "#4C78A8",
                    "#F58518",
                    "#E45756",
                    "#72B7B2",
                    "#54A24B",
                    "#EECA3B",
                    "#B279A2",
                    "#FF9DA6",
                ],
            ),
            link=dict(
                source=sources,
                target=targets,
                value=values,
                color=[
                    "rgba(76,120,168,0.45)",
                    "rgba(229,87,86,0.45)",
                    "rgba(114,183,178,0.45)",
                    "rgba(84,162,75,0.45)",
                    "rgba(245,133,24,0.45)",
                    "rgba(238,202,59,0.45)",
                    "rgba(178,121,162,0.45)",
                ],
            ),
        )
    ]
)

fig.update_layout(
    title=dict(text="来訪後の顧客フロー（Plotly Sankey）", x=0.5, font=dict(size=18)),
    font=dict(size=12, color="#222"),
    margin=dict(l=10, r=10, t=40, b=10),
)

# ブラウザで共有できるインタラクティブ HTML
fig.write_html("static/images/visualize/advanced/sankey-diagram.html", include_plotlyjs="cdn")

# ドキュメント用の静的画像 (kaleido のインストールが必要: pip install kaleido)
fig.write_image("static/images/visualize/advanced/sankey-diagram.png", scale=2)

plt.show()

Plotlyで描画したサンキーダイアグラムで顧客フローを可視化した図

実行結果の読み方 #

帯の太さが人数で、流入から出る 4 本のうち無料登録への 420 の帯が最も太く、直帰への 100 が最も細くなります。無料登録ノードから右へ出る 3 本の帯の合計は左から入る帯と同じ太さで、そのうち有料化への 260 が最も太いので、「流入 → 無料登録 → 有料化」が主要経路だと読めます。ボトルネックを探すなら、特定の出口（たとえば有料化）に向かう帯を右から左へたどり、途中でどのノードから何人が別の方向に逃げたかを帯の分岐で確認します。HTML 版では帯にマウスを乗せると source → target: value の数値が表示されます。

参考リンク

使いどころと落とし穴 #

サンキーダイアグラムは、顧客の遷移経路やコストの配分、エネルギーの流れのように、複数段階で枝分かれする量を関係者に見せるときに向いています。段階が 5 を超えるとリンクが左右に広がって追跡が難しくなるので、主要な 3〜4 段階に集約し、細かい分岐は別の図に分けてください。ノードが 15 を超えると帯が交差して絡み合うため、value の小さいリンクをまとめて「その他」ノードに寄せると読みやすくなります。すべてのリンクを 1 色にすると分岐先が追えないので、この例のように出発ノードの色で塗り分けます。段階ごとの歩留まりだけを見せたいなら、分岐のないファネルチャートの方が説明なしで伝わります。