How can you color each circle in the D3 circle pack layout

Question

Here is an example of the pack layout in d3js:

http://bl.ocks.org/4063530

Is it possible to control the colors of the individual cirles?

Here is another example of the pack layout with colors:

http://bl.ocks.org/4063269

Can you help me understand how the colors are assigned to the bubbles in the second chart?

Answer 1

You can just add the attribute fill to change the color:

node.append("circle")
      .attr("r", function(d) { return d.r; })
      .style("fill", function(d){ return d.color; });

In the example above, suppose your data contains a color field.