Public
Edited
Jul 6, 2023
41 forks
Importers
5 stars
Insert cell
Insert cell
Plot.plot({
width: 975,
height: 610,
projection: "identity",
color: {
type: "quantize",
n: 9,
domain: [1, 10],
scheme: "blues",
label: "Unemployment rate (%)",
legend: true
},
marks: [
Plot.geo(counties, Plot.centroid({
fill: d => unemployment.get(d.id),
tip: true,
channels: {
County: d => d.properties.name,
State: d => statemap.get(d.id.slice(0,2)).properties.name
}
})),
Plot.geo(states, {stroke: "white"})
]
})
Insert cell
Insert cell
unemployment = new Map((await FileAttachment("unemployment-x.csv").csv()).map(d => [d.id, +d.rate]))
Insert cell
Insert cell
us = FileAttachment("counties-albers-10m.json").json()
Insert cell
counties = topojson.feature(us, us.objects.counties)
Insert cell
states = topojson.feature(us, us.objects.states)
Insert cell
statemap = new Map(states.features.map(d => [d.id, d]))
Insert cell
Insert cell
statemesh = topojson.mesh(us, us.objects.states, (a, b) => a !== b)
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