Skip to content Skip to sidebar Skip to footer

Legend In D3 Circle Pack Diagram

I need to create a legend for the bubble/circle pack chart. I'm displaying the values inside the circle. I need the names as the legend. For an instance, in the below provided data

Solution 1:

You can simply iterate through your data set and add those values:

legend.selectAll("circle").data(data.children)
      .enter()
      .append("circle")
      .attr("cy", function(d,i) { return (i+1) * 10; })
      .attr("r", function(d) { return d.r+ 7; })
      .style("fill", function(d,i) { 
        return color[i];
      });
legend.selectAll("text").data(data.children)
      .enter()
      .append("text")
      .attr("transform", function(d,i) {
        return "translate(10," + ((i+1) * 10) + ")";
      });

Post a Comment for "Legend In D3 Circle Pack Diagram"