d3.js - 父级的值大于其子级的总和的树 [英] d3.js - Treemap where parent's value is greater than sum of its children

问题描述

我尝试使用d3.js来显示一个树形图，其中父级的值可能大于其子级的总和。例如，假设我在一个命名空间层次结构中可视化代码行。命名空间B和C是A的子代，每行为1行。命名空间A为3行 - B和C为1行，自身为1行。因此，单独的B和C不会决定A的大小。

我想在树形图上显示这个属性。特别地，父应该是在尺寸正确成比例的子矩形的顶部的矩形。如果父项没有添加任何额外的大小，父项应该仍然显示，但最小尺寸（也许一个小矩形横跨子项的顶部，只是为了表示父名称）。

目前，子值值节点只是沿着层次向上传播，而忽略非叶节点的实际大小。

我想在d3.js中使用一个解决方案，因为这是我在其余代码中使用的库，但是如果它解决了我打开另一个框架

解决方案

您可能需要请尝试提出请求＃574 ，允许内部层次结构节点具有价值。

否则，您可以向数据添加不可见的虚拟节点，其中包含与内部节点相关联的额外值，但不是由其子节点计算。呈现树形图时，您可以过滤这些节点，以防止他们从显示（即使他们是布局的一部分）。或者您可以将其样式设置为显示：无。

I am trying to use d3.js to display a treemap where a parent's value may be greater than the sum of its children. For example, say I am visualizing lines of code in a namespace hierarchy. Namespace B and C are children of A and are 1 line each. Namespace A is 3 lines - 1 line for B and C and 1 line for itself. Thus B and C alone do not dictate the size of A.

I want to display this property on the treemap. In particular, the parent should be a rectangle on top of the children rectangles whose size is correctly proportional. If the parent does not add any additional size, the parent should still be displayed but at minimal size (maybe a tiny rectangle spanning the top of the children, just to indicate the parent name).

Currently the children value nodes are just propagated up the hierarchy disregarding the actual size of non-leaf nodes.

I would like a solution in d3.js, because that is the library I am using in the rest of the code, but I am open to another framework if it solves the problem.

Thank you.

解决方案

You may want to try pull request #574 which allows internal hierarchy nodes to have value.

Otherwise, you could add invisible dummy nodes to your data that contain the extra value associated with internal nodes but not accounted for by their children. When you render the treemap, you can filter those nodes to prevent them from being displayed (even though they're part of the layout). Or you could set their style to display: none.

这篇关于d3.js - 父级的值大于其子级的总和的树的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！