【D3.js 学习总结】8、D3布局介绍

布局是 D3 中一个十分重要的概念，可以理解成 “制作常见图形的函数”，有了它制作各种相对复杂的图表就方便多了。
D3 与其它很多可视化工具不同，相对来说较底层，对初学者来说不太方便，但是一旦掌握了，就比其他工具更加得心应手。

下图展示了 D3 与其它可视化工具的区别：

布局的作用是：将不适合用于绘图的数据转换成了适合用于绘图的数据。

D3 总共提供了 12 个布局：

• 饼状图（Pie）
• 力导向图（Force）
• 弦图（Chord）
• 捆图（Bundle）
• 直方图（Histogram）
• 堆栈图（Stack）
• 集群图（Cluster）
• 打包图（Pack）
• 分区图（Partition）
• 树状图（Tree）
• 矩阵树图（Treemap）
• 层级图（Hierarchy）

12 个布局中，层级图（Hierarchy）不能直接使用。集群图、打包图、分区图、树状图、矩阵树图是由层级图扩展来的。如此一来，能够使用的布局是 11 个（有 5 个是由层级图扩展而来）。这些布局的作用都是将某种数据转换成另一种数据，而转换后的数据是利于可视化的。

Pie —- 饼状图

Force —- 力学图、力导向图

Chord —- 弦图

Bundle —- 捆图

Cluster —- 集群图

Histogram —- 直方图（数据分布图）

Pack —- 打包图

Partition —- 分区图

Stack —- 堆栈图

Tree —- 树状图

Treemap —- 矩阵树图