Published
Edited
Oct 15, 2019
10 forks
33 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
data = cstParseRows(source, ([name, value, color]) => ({
name,
value: value === undefined ? undefined : +value,
color
}))
Insert cell
partition = data => {
const root = d3.hierarchy(data);
root.sum(d => d.children ? 0 : isNaN(d.value) ? 1 : d.value);
if (sorted) root.sort((a, b) => b.value - a.value);
return d3.partition().size([2 * Math.PI, radius])(root);
}
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 / 2)
.innerRadius(d => d.y0)
.outerRadius(d => d.y1 - 1)
Insert cell
format = d3.format(",d")
Insert cell
width = 954
Insert cell
height = width
Insert cell
radius = Math.min(width, height) / 2
Insert cell
fillColor = "#e4e4e4"
Insert cell
lightColor = "#fff"
Insert cell
darkColor = "#000"
Insert cell
import {rasterize, serialize} from "@mbostock/saving-svg"
Insert cell
import {cstParseRows} from "@mbostock/comma-separated-tree"
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