Circle Packing Chart

Given an array of data objects that looks something like this:

var data = [
  {parent: "Group 1", id: "alpha", value: 29},
  {parent: "Group 1", id: "beta", value: 10},
  {parent: "Group 1", id: "gamma", value: 2},
  {parent: "Group 2", id: "delta", value: 29},
  {parent: "Group 2", id: "eta", value: 25}

Only a few lines of code are needed to transform it into an interactive Pack:

new d3plus.Pack()
  .groupBy(["parent", "id"])

Colors are assigned to each unique ID using the color assign function, and the bubbles are created using the Circle class.