布局是 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 —- 矩阵树图
相关资源:java统计代码行数生成json文件 D3.js绘制树图(矩形分区图、圆状集群图、矩阵树图) 实验报告