§01-06Data Visualization
サンキー図
段階間の流量をリンクの太さで表す。
流入元から流出先へ量がどう分かれて移るかを見せる。経路ごとの割合を比べたいときや、途中の離脱を見つけたいときに向く。
実装のポイント
リンクの太さは流量に比例させ、ノードの高さは流入と流出の合計に一致させる。本格的には d3-sankey でノード配置と曲線を算出する。
- 特徴
- チャート
- デモで使っているもの
- SVG
- ソース
- sankey.tsx
§01-06Data Visualization
段階間の流量をリンクの太さで表す。
流入元から流出先へ量がどう分かれて移るかを見せる。経路ごとの割合を比べたいときや、途中の離脱を見つけたいときに向く。
リンクの太さは流量に比例させ、ノードの高さは流入と流出の合計に一致させる。本格的には d3-sankey でノード配置と曲線を算出する。