Learn D3.js

Sunburst diagrams

A sunburst diagram can be created using the x coordinates as an angle , and the y coordinates as a radius . The size() method should declare the maximum angle and radius . An arc layout function can be used to draw the slices:

const partition = d3.partition()                    .size([Math.PI * 2, height/2-50])const partitionData = partition(root); const arc = d3.arc()              .startAngle(d => d.x0)              .endAngle(d => d.x1)              .innerRadius(d => d.y0)              .outerRadius(d => d.y1);

You might prefer to use the angle in degrees (which is simpler if you need to rotate using SVG transforms). In this case, you need to convert it to radians before using the arc function:

const partition = d3.partition()                    .size([360, height/2-50]) // angle in degreesconst partitionData ...