D3冰柱图中可以有多个父/根节点吗？

Question

我是d3的新手，目前正在研究Icicle布局示例 。 我有两个问题：

1. 在此示例中是否可以有多个顶级节点？ 换句话说，我们可以拥有3个顶级节点（“ flare1”，“ flare 2”和“ flare 3”），而不是单个单独的顶级节点“ flare”吗？ 我曾尝试将json数据作为对象数组导入，但这没有用。

如果不可能有多个顶级节点，如何隐藏根节点（“ flare”），使第二级节点（“ vis”，“ util”，“ animate”）看起来是顶级的节点？

2. 我们如何根据节点在json文件中的位置而不是其大小对节点（在特定级别上）进行排序？ 换句话说，如何在上面的示例中对第二级节点进行排序，以便它们按“分析”，“集群”，“图”等（它们在json文件中的顺序）的顺序（从左到右）出现（从左到右） ）; 而不是其当前顺序（“可见”，“实用”，“动画”等）。

Answer 1

一个分区布局可能无法使用多个父节点/节点，因为它是一种假定单亲关系的层次布局。 但是应该使用两个分区布局（由两个不同的分层json支持）来实现。 您可以使用d3.nest()从单个平面数组（即与flare.json不同）生成两个json。

渲染代码也可能需要变得更加复杂，以便可以在这两种布局之间进行协商。

对于＃2，您可以根据需要使用partition.sort()进行排序。 对于您的情况，您想按输入数组中它们的索引排序。

UPDATE

如果每个节点确实只有一个父节点，则可以非常简单地实现您所描述的内容。 因此，如果您希望顶部有3个节点，则仍然需要将它们“包装”在单个公共父节点中，然后将其传递给分区布局。 然后，您需要注意不要渲染父节点，方法是在绑定和附加DOM节点之前将其过滤掉，或者将其设置为不显示。 无论哪种情况，都可以检查d.depth == 0是否标识根节点。 而且，您还需要平移所有节点，以弥补缺少的根节点留下的间隙，因为布局将设置所有x和y坐标，就好像根节点在布局中一样。 （如果使用.size()函数为根节点返回0，也许在分配x和y位置时有一种使布局“实现”根节点消失的方法）。