[英]D3js: Draw pack layout without the outermost circle
I am trying to draw a pack layout in d3.js without outermost variable. 我正在尝试在d3.js中绘制没有最外层变量的包布局。 I want to draw a pack layout without outer most parent circle.
我想绘制一个没有最外面的父圆的背包布局。 Is there any way to do it?
有什么办法吗?
Yes, there is. 就在这里。 I would suggest following approach: you leave all circle pack initialization intact.
我建议采用以下方法:完整保留所有Circle Pack初始化。 You only change the point of code where circles are actually appended to DOM/SVG tree.
您只需更改将圆环实际附加到DOM / SVG树的代码点。 I'll show this in a couple of examples.
我将在几个示例中对此进行展示。 This jsfiddle is an example of "regular" circle pack:
此jsfiddle是“常规”圈子包的示例:
The key code responsible for adding circles to the DOM tree is this: 负责将圆添加到DOM树的关键代码是这样的:
var circles = vis.append("circle")
.attr("stroke", "black")
.style("fill", function(d) { return !d.children ? "tan" : "beige"; })
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; })
.attr("r", function(d) { return d.r; });
If one adds just this line between "vis" and ".append("circle")": (another jsfiddle available here ) 如果只是在“ vis”和“ .append(” circle“)”之间添加这一行:( 此处提供另一种jsfiddle)
.filter(function(d){ return d.parent; })
the root node will disappear: 根节点将消失:
If one adds this line: 如果添加此行:
.filter(function(d){ return !d.children; })
all nodes except leave nodes (in other words, those without children) will disappear: 除离开节点(换句话说,没有子节点)以外的所有节点都将消失:
And, a little bit more complex, this line 而且,稍微复杂一点
.filter(function(d){ return (d.depth > 1); })
will make the root parent circle and all its direct children disappear: 将使根父圆及其所有直接子圆消失:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.