Developer @Observable
Plot.plot({
color: {
domain: keys,
scheme: "PuOr",
legend: true
},
y: {
tickFormat: "s",
grid: true
},
x: {
axis: null,
domain: keys
},
// Set the domain to control the sort order of the groups
fx: { domain: ["FL", "CA", "TX", "IL", "PA"] },
marks: [
Plot.barY(data, {
x: "key",
x2: "key",
y: "population",
fill: "key",
fx: "state"
}),
Plot.ruleY([0])
]
})
keys = d3.sort(new Set(data.map(d => d.key)), d => parseInt(d.match(/\d+/)[0]))
data = FileAttachment("population-state-age.csv").csv({typed: true})
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.
