d3.js包布局中的圆形重叠了。

Question

我有一个与d3.js包布局相关的问题。圆形重叠在一起，我不知道为什么...

我使用了这个例子中的代码：

http://mbostock.github.com/d3/talk/20111116/pack-hierarchy.html

那就是我的工作：

http://projekty.bron.it/d3-circles-all/

如您所见，重叠使图表无法使用。

- krystian

---

也遇到了这个问题，正在尝试解决。 - Dal Hundal

Answer 1

我尝试实现了同样的圆装填示例，也出现了重叠的圆。对我而言，问题是由于数据父节点没有子节点且大小为0所致。一旦我将具有空子数组的父节点更改为正确格式的叶子节点，问题就消失了。

在使用数据结构之前存在严重的重叠问题：

root = {name:"root",
    children:[
       {name:"badchildlessparent", children:[]},
       {name:"parentnodewithchild", children:[{name:"a leaf",size=50}]}
     ]
}

数据结构优化之美：精美的封装

root = {name:"root",
    children:[
        {name:"fixedit_now_child", size=1} ,
        {name:"parentnodewithchild", children:[{name:"a leaf",size=50}]}
    ]
}

- user2391495

Answer 2

英译中：

帮助我的是以下方法：通过排序改变流程顺序

所以你有

var pack = d3.layout.pack()
.size([r,r])
.value(function(d) { return d.size; });

添加

var pack = d3.layout.pack()
.sort(d3.descending)
.size([r,r])
.value(function(d) { return d.size; });

- user3008619