Public
Edited
May 12, 2023
7 forks
3 stars
Insert cell
Insert cell
Plot.plot({
marginLeft: 50,
color: { domain: keys, scheme: "Warm", legend: true },
facet: { data: population, x: "state" },
y: { tickFormat: "s", grid: true },
x: { axis: null, domain: keys },
marks: [
Plot.ruleX(population, {
x: "key",
y: "population",
stroke: "key",
strokeWidth: 3
}),
Plot.dot(population, {
x: "key",
y: "population",
fill: "key",
r: 5,
sort: { fx: "y", reduce: "sum", reverse: true }
}),
Plot.ruleY([0])
]
})
Insert cell
population = FileAttachment("us-state-population.csv").csv({typed: true})
Insert cell
keys = d3.sort(new Set(population.map(d => d.key)), d => parseInt(d.match(/\d+/)[0]))
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