> For the complete documentation index, see [llms.txt](https://reee-visual.gitbook.io/ray-design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://reee-visual.gitbook.io/ray-design/sang-ji-tu.md).

# 桑基图

桑基图 (Sankey Diagram)是一种表现流程的示意图。&#x20;

用于描述一组值到另一组值的流向，分支的宽度对应了数据流量的大小。

### 一、桑基图图解

![](/files/do453xuBne58kIgg9Xyw)

### 二、基本属性

![](/files/1zx6CGSFJecE6689SdvQ)

### 三、数据结构

第一行：流出的节点；第二行：流入的节点；第三行：流量。

![](/files/umnF7axfsoEO4xeEU8cK)

### 四、适用场景

#### 4.1 数据流向

桑基图即桑基能量分流图，适合表现分配、归类、变化和流动情况。&#x20;

例如下图：LLNL 于 2012 年 10 月发布的最新能源图表描绘了 2011 年的数据，并说明了国家能源部门的一些重大变化。

![](/files/aFbprgRAFdMUGf6SzZ1M)

图中很明显美国人在 2011 年使用的能源比上一年少，这主要是由于运输和住宅部门转向了更高效的能源技术。

#### 4.2 能量守恒

在数据流动的可视化过程中，桑基图紧紧遵循能量守恒，无论数据怎样流动，数据的总量从开始到结束都不可能有任何变化，不可以在中间创造数据，流失（损耗）的数据应流向表示损耗的节点。&#x20;

例如下图是法国公共管理部门收支情况，桑基图能做到在展示资金流动的同时，遵守数据的“能量守恒定理”。

![来源：www.behance.net](/files/znkcch7V1r29NZWXUkt8)

### 五、不适用场景

#### 5.1 边的宽度不一致

桑基图的每条边的宽度应是一致的。即使有时候出于设计需要，边的宽度看上去不等，所代表的数据是不变的。如果边的宽度不等，推荐使用和弦图。

#### 5.2 变量过多

在没有交互的情况下，变量如果太多，或者使用过多或过于相似的颜色，会导致“一团乱麻”的状态，使人难以聚焦。&#x20;

例如下图（Hirst, 2013）。这种情况下，建议先将变量进行必要的归类，并赋予具有辨识度、反差感的颜色。有进一步需求的话，加入交互功能，在鼠标点击时，仅突出显示一个支流。

![Hirst, 2013](/files/z11lcEZF90JaygLe9Rw5)

### 六、气泡图图史

桑基图(Sankey Diagram)是以爱尔兰裔工程师马修·亨利·菲尼亚斯·里尔·桑基（Matthew Henry Phineas Riall Sankey）而命名的。

![Matthew Henry Phineas Riall Sankey](/files/uvz1HlJnhP5p6cSX64x9)

他在1898年的时候就使用这种图来显示蒸汽机的能源效率。与此同时，这个图以他的名字命名为“桑基图”。

![](/files/Ch6T6GJQnYrdBSQ4qxZl)

但这并不是最早的桑基图，最著名的“桑基图”由法国土木工程师查尔斯·约瑟夫·米纳德( Charles Joseph Minard)在1869年创建的图形（从形式上讲，是流程图）。&#x20;

描绘了军队在欧洲的运动，并展示了他们的队伍如何从 1812 年 6 月入侵俄罗斯时的 422000 人减少到 10000 人，当时在经历了一个严冬后撤退后，部队的残余部分摇摇晃晃地回到了波兰。

![图片来源：www.ecureservercdn.net](/files/lUGj5YeISJWudQC69wiC)

由于米纳德没有桑基有影响力，错失了一个被命名的机会。&#x20;

桑基之后，桑基图渐渐成为在科学和工程领域，代表热平衡、能量流、物质流的标准模型，在一些产品的生命周期评估中也常被使用。&#x20;

美国总统唐纳德·特朗普( Donald Trump)非常喜欢用 Twitter来攻击各机构和个人，包括CNN、希拉里·克林顿、阿诺德·施瓦辛格，甚至是自己的党政参议员。&#x20;

下图是 Stef W. Kight 用一个类似桑基图的图形展示了特朗普在2017年1月 20日到10月11日，在 Twitter 上攻击了谁以及次数。

![图片来源：www.axios.com](/files/hG1b286JMvAJacXR9HsD)

最右边紫色的边所代表的媒体，一共被特朗普攻击了89次，成为特朗普的“最爱"。

### 七、设计开眼

以下为具有代表性的设计案例，更多案例持续添加中。

![金奖作品《在他们的路上：外国战斗士之旅》](/files/YqDB1g5KkqP3eIHJ7rKM) ![印度发生强奸事件的动态可视化](/files/5PYAomnYX7WHMYR4wFEt)

### 八、更多学习资源

[1、拥有1000+的桑基图网站。](https://www.sankey-diagrams.com/)

[2、顺其自然：桑基图说明了能源经济。](http://ecowest.org/2013/05/06/sankey-energy/)

[3、数据可视之美 - 桑基图。](https://zhuanlan.zhihu.com/p/127360262)

[4、桑基图有何作用，桑基图又是怎么做出来的？](https://www.zhihu.com/question/45502919)
