Arcs topic
The arc generator produces a circular or annular sector, as in a pie or donut chart. Arcs are centered at the origin; use a transform to move the arc to a different position.
svg.append("path")
.attr("transform", "translate(100,100)")
.attr("d", Arc.withDefaults()([{
"innerRadius": 100,
"outerRadius": 200,
"startAngle": -pi / 2,
"endAngle": pi / 2
}]));
If the absolute difference between the start and end angles (the angular span) is greater than 2π, the arc generator will produce a complete circle or annulus. If it is less than 2π, the arc’s angular length will be equal to the absolute difference between the two angles (going clockwise if the signed difference is positive and anticlockwise if it is negative). If the absolute difference is less than 2π, the arc may have rounded corners and angular padding.
See also the pie generator, which computes the necessary angles to represent an list of data as a pie or donut chart; these angles can then be passed to an arc generator.