2

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

  1. 在这个例子中是否可以有多个顶级节点？换句话说，我们可以有 3 个顶级节点（“flare1”、“flare 2”和“flare 3”），而不是“flare”的单个顶级节点，然后它们可以有各自的子节点吗？我尝试将 json 数据作为对象数组导入，但这不起作用。

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

  1. 我们如何根据节点在 json 文件中的位置而不是它们的大小对节点（在特定级别上）进行排序？换句话说，我们如何对上例中的二级节点进行排序，使它们按照“分析”、“集群”、“图”等的顺序（从左到右）出现（它们在 json 文件中的顺序） ); 而不是他们当前的顺序（“vis”、“util”、“animate”等）。
4

1 回答 1

1

单个分区布局可能无法实现多个父节点/节点，因为它是假定单父关系的分层布局。但这应该可以使用由两个不同的分层 json 支持的两个分区布局来实现。您可以通过使用d3.nest().

渲染代码也可能需要变得更复杂，以便它可以在 2 个布局之间进行协商。

对于#2，您可以根据partition.sort()需要订购它们。在您的情况下，您希望按输入数组中的索引进行排序。

更新

你可以很简单地实现你所描述的——如果每个节点真的只有一个父节点。因此，如果您希望顶部有 3 个节点，它们仍然需要“包装”在一个共同的父节点中，然后将其传递给分区布局。然后，您需要注意不渲染父节点，方法是在绑定和附加 DOM 节点之前将其过滤掉，或者将其设置为不显示。无论哪种情况，您都可以检查是否d.depth == 0识别根节点。并且您还需要将所有节点向上平移以解决丢失的根节点留下的间隙，因为布局将设置所有 x 和 y 坐标，就好像根节点在布局中一样。（也许有办法让布局“实现”.size()

于 2015-02-24T18:11:07.673 回答