Is it possible to use circle layout in d3.js with fixed circle sizes?

This example layout of an environment package ( http://bl.ocks.org/4063269 ) is ideal for a project that I am working on, however, it varies all circles in relation to each other:

enter image description here

Is there an easy way to specify fixed radii for each circle?

I have looked at the source code, examples, google and stackoverflow and cannot find anything useful.

Accurate lap calibration is important to me.

+8
javascript svg circle-pack
source share
2 answers

It is possible, and a simple thing. The first answer is accurate, but I believe that my simpler, more explicit, so I attach it too.

Please take a look at this example: jsfiddle

When you click the "Constant" button, you will see something like this:

enter image description here

The key code line is as follows:

pack.value(function(d) { return 100; }) 

This will make the circle radii constant. 100 can be any constant, of course. You can apply this line in initializing a package of packages (most likely, this will be your case) or reinitializing (as in my example).

Hope this helps.

+6
source share

If you execute the code in the example you specified, the size of the <circle> elements will be determined here:

 node.append("circle") .attr("r", function(d) { return dr; }) // ... 

To fix the size of the circles to, say, 50 , you can do this:

 node.append("circle") .attr("r", function(d) { return 50; }) // ... 

Update

This, however, will break the layout, as indicated in the comment. To fix this, you can provide the same value for each node:

 // Returns a flattened hierarchy containing all leaf nodes under the root. function classes(root) { var classes = []; function recurse(name, node) { if (node.children) node.children.forEach(function(child) { recurse(node.name, child); }); else classes.push({packageName: name, className: node.name, value: node.size}); } recurse(null, root); return {children: classes}; } 

in

 // Returns a flattened hierarchy containing all leaf nodes under the root. function classes(root) { var classes = []; function recurse(name, node) { if (node.children) node.children.forEach(function(child) { recurse(node.name, child); }); else classes.push({packageName: name, className: node.name, value: 1}); } recurse(null, root); return {children: classes}; } 
+1
source share

All Articles