The avatar for @emfielduva
Eric Field
Building and Using Tools to See. UVA Architecture + Data Science. IT Director. Instructor.
Public
Maps
Edited
Apr 5, 2023
Fork of Maps - Observable Plot - Choropleth
•
2 forks
Insert cell
Insert cell
Insert cell
Insert cell
Plot.plot({
projection: "equal-earth",
width,
r: {range: [0,15]},
marks: [
Plot.geo(world110m, {fill: "#eee", stroke: "#bbb"}),
Plot.graticule(),
Plot.sphere( {stroke: "#ddd"} ),
Plot.dot(
world110m.features,
Plot.centroid({
r: d => Math.abs(findInData(world_gdp_growth,"Country Code",d.id,year)),
fill: d => colorScale(findInData(world_gdp_growth,"Country Code",d.id,year)),
opacity: 0.8,
stroke: "#aaa",
strokeWidth: 0.5
})
)
]
})
Insert cell
Insert cell
Insert cell
Insert cell
colorScale = d3.scaleLinear().domain([-25,0,25]).range(["red","gray","green"])
Insert cell
findInData = (data,inCol,inVal,outCol) => {
if (data.find(d => d[inCol] == inVal)) {
return (data.find(d => d[inCol] == inVal))[outCol];
} else {
return "";
}
}
Insert cell
Insert cell
import {world_gdp_growth} from "@emfielduva/dvlib_sampledata"
Insert cell
gdpdata = world_gdp_growth
Insert cell
gdpdata
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
Insert cell
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