Plot.plot({
projection: "albers-usa",
width,
color: {
scheme: "Oranges",
legend: true,
percent: true,
label: "Percentile Rank"
},
marks: [
Plot.geo(nation),
Plot.geo(themesData, {
geometry: (d) => features.get(d.fips), //Use `features` Map below to get county geometry
fill: "value",
fx: "theme"
}),
Plot.geo(statemesh, { stroke: "#fff" })
]
})
features = new Map(counties.features.map((d) => [d.id, d]))
themes = [
["RPL_THEME1", "Socioeconomic Status"],
["RPL_THEME2", "Household Characteristics"],
["RPL_THEME3", "Racial & Ethnic Minority Status"],
["RPL_THEME4", "Housing Type & Transportation"]
]
import {us} from "@observablehq/us-geographic-data"
nation = topojson.feature(us, us.objects.nation)
counties = topojson.feature(us, us.objects.counties)
states = topojson.feature(us, us.objects.states)
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.
