data = d3.csvParse(await FileAttachment("population-by-age@5.csv").text(), d3.autoType)
stack = {
const total = d3.sum(data, d => d.value);
let value = 0;
return data.map(d => ({
name: d.name,
value: d.value / total,
startValue: value / total,
endValue: (value += d.value) / total
}));
}
color = d3.scaleOrdinal()
.domain(data.map(d => d.name))
.range(d3.quantize(t => d3.interpolateSpectral(t * 0.8 + 0.1), data.length).reverse())
color.range()
x = d3.scaleLinear([0, 1], [margin.left, width - margin.right])
formatPercent = x.tickFormat(null, "%")
width = 964
height = 66
margin = ({top: 0, right: 0, bottom: 0, left: 0})
d3 = require("d3@6")
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.
