Published
Edited
Apr 14, 2020
1 star
Insert cell
Insert cell
Insert cell
import {legend} from "@d3/color-legend"
Insert cell
Insert cell
partition = data => {
const root = d3.hierarchy(data)
.sum(d => d.value)
.sort((a, b) => b.value - a.value);
return d3.partition()
.size([2 * Math.PI, root.height + 1])
(root);
}
Insert cell
color = d3.scaleOrdinal(d3.quantize(d3.interpolateSinebow, data.children.length + 1))
Insert cell
format = d3.format(",d")
Insert cell
width = 600
Insert cell
radius = width / 6
Insert cell
arc = d3.arc()
.startAngle(d => d.x0)
.endAngle(d => d.x1)
.padAngle(d => Math.min((d.x1 - d.x0) / 2, 0.005))
.padRadius(radius * 1.5)
.innerRadius(d => d.y0 * radius)
.outerRadius(d => Math.max(d.y0 * radius, d.y1 * radius - 1))
Insert cell
d3 = require("d3@5")
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more