Public
Edited
Oct 12, 2023
Insert cell
Insert cell
map = {
const width = 975;
const height = 610;
const context = DOM.context2d(width, height);
const path = d3.geoPath(null, context);
context.canvas.style.maxWidth = "100%";
context.lineJoin = "round";
context.lineCap = "round";

// context.beginPath();
// path(topojson.mesh(us, us.objects.counties, (a, b) => a !== b && (a.id / 1000 | 0) === (b.id / 1000 | 0)));
// context.lineWidth = 0.5;
// context.strokeStyle = "#aaa";
// context.stroke();

context.beginPath();
path(topojson.mesh(us, us.objects.states, (a, b) => a !== b));
context.lineWidth = 0.5;
context.strokeStyle = "#000";
context.stroke();

context.beginPath();
path(topojson.feature(us, us.objects.nation));
context.lineWidth = 1;
context.strokeStyle = "#000";
context.stroke();

return context.canvas;
}
Insert cell
us = FileAttachment("counties-albers-10m.json").json()
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