44:["$","title",null,{"children":"01 · Points | Jakob Listabarth | Observable"}] 4c:T60d,

All^* places with point in their name.

^*from Overture Maps data

${svg}

Mostly water

Mostly land

4d:T69d,const projection = d3[projectionName]().scale(6371.0088).translate([0, 0]); const [[x0, y0], [x1, y1]] = d3.geoPath(projection).bounds({type: "Sphere"}); const cols = Math.ceil((x1 - x0) / cellKm); const rows = Math.ceil((y1 - y0) / cellKm); // 1. count points per grid cell, keyed by the cell's column/row const counts = d3.rollup( points.features .map(f => projection(f.geometry.coordinates)) .filter(Boolean) .map(([px, py]) => [ Math.floor((px - x0) / cellKm), Math.floor((py - y0) / cellKm) ]), v => v.length, ([i]) => i, ([, j]) => j ); // 2. build the grid with array methods const cells = d3.cross(d3.range(cols), d3.range(rows), (i, j) => { const cx = x0 + (i + 0.5) * cellKm; const cy = y0 + (j + 0.5) * cellKm; const lonlat = projection.invert([cx, cy]); return {i, j, cx, cy, lonlat}; }) .filter(({cx, cy, lonlat}) => { if (!lonlat || !lonlat.every(Number.isFinite)) return false; const back = projection(lonlat); return back && Math.hypot(back[0] - cx, back[1] - cy) <= 1e-3; }) .map(({i, j, lonlat}) => ({ i, j, x: x0 + i * cellKm, y: y0 + j * cellKm, isLand: land.features.some(f => d3.geoContains(f, lonlat)), count: counts.get(i)?.get(j) ?? 0 })); const svg = d3.create("svg") .attr("viewBox", [x0, y0, x1 - x0, y1 - y0]) .attr("width", width) .style("max-width", "100%") .style("height", "auto"); svg.append("g") .selectAll("circle") .data(cells) .join("circle") .attr("cx", d => d.x) .attr("cy", d => d.y + cellKm/2) .attr("r", (d) => d.isLand ? cellKm * 0.4 : 40) .attr("fill", d => d.count ? "blue" : "#eee") .append("title") .text(d => `${d.count} points`);4e:[{"id":"63dac82affb72439877750d3f0e3c9567776a65e817bd9b47c9dc8164f8174a0bb83207263df43161f5c91b5938b8ed84d8932208d26777bc3f8e34064a804ee","href":"https://static.observableusercontent.com/files/63dac82affb72439877750d3f0e3c9567776a65e817bd9b47c9dc8164f8174a0bb83207263df43161f5c91b5938b8ed84d8932208d26777bc3f8e34064a804ee","name":"points.json","type":"application/json","lastModified":1793452782000,"size":1229},{"id":"1e5916e0f6db5a445191c076438347bf9330e48b47c91fc02e0e40fa51d0ff0aff398f8de865080819a4666c68e7b4ec656c4b12c687a4b825fb68764f143161","href":"https://static.observableusercontent.com/files/1e5916e0f6db5a445191c076438347bf9330e48b47c91fc02e0e40fa51d0ff0aff398f8de865080819a4666c68e7b4ec656c4b12c687a4b825fb68764f143161","name":".observable/cache/fetch-61ccj7ib11w22iscvn0xlo3caul2k0bh.blob","type":"text/plain; charset=utf-8","lastModified":1793541734000,"size":138160},{"id":"dc77d948fcde85247289fbae4ee2b0ba27012a90ebb15125abfd389780953a77f2efd679d0d1e651b63d575a88352068f418987e5aa3ed9aa9f897e682cf06f9","href":"https://static.observableusercontent.com/files/dc77d948fcde85247289fbae4ee2b0ba27012a90ebb15125abfd389780953a77f2efd679d0d1e651b63d575a88352068f418987e5aa3ed9aa9f897e682cf06f9","name":"points_ov.geojson","type":"application/geo+json","lastModified":1793544298000,"size":65390}] 48:{"id":"a010eadc945bd1a4","slug":"30dmc26-01-points","title":"01 · Points","thumbnail":"86875fce3d9dab7565cf192f907670fb3708be536ab750cfd58a27d72c223493","access_level":"public","create_time":"$D2026-11-01T13:55:14.869Z","update_time":"$D2026-11-01T20:35:50.343Z","view_time":null,"first_public_time":"$D2026-11-01T20:31:39.641Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"012b0b3e382a554e","login":"jakoblistabarth","name":"Jakob Listabarth","avatar_url":"https://avatars-next.observableusercontent.com/9729178963e994d34cfa91cdd1320563920ead897b5f1934136a47a96b83bd9d","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":579,"publish_version":579,"role":null,"authored":false,"authors":[{"type":"individual","id":"46e29826d3649e64","login":"jakoblistabarth","name":"Jakob Listabarth","avatar_url":"https://avatars-next.observableusercontent.com/a0e873c9f95e3800e63d3dcbbf26fd397ec65968ac816531408eda0ff84da48f","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"team","id":"012b0b3e382a554e","login":"jakoblistabarth","name":"Jakob Listabarth","avatar_url":"https://avatars-next.observableusercontent.com/9729178963e994d34cfa91cdd1320563920ead897b5f1934136a47a96b83bd9d","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"01 · Points","cells":[{"id":1,"value":"# 01 · Points","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"$4c","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"const projectionName = view(\n Inputs.select([\"geoNaturalEarth1\", \"geoEqualEarth\"], {label: \"Projection\"})\n);","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"const cellKm = view(\n Inputs.range([150, 1000], {label: \"Cell size (in km)\", value: 250, step: 1})\n);","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"Find all names with strinh `point` in it, alongside their overture maps id, below. 👇","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"html`\n

\n ${pointNames.map(([id, names]) => html`\n

\n ${[...new Set(names)].join(\", \")}\n ${id} \n `)}\n`","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"## Implementation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"$4d","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"const points = await (await FileAttachment(\"points_ov.geojson\")).json()\nconst response = await fetch(\"https://raw.githubusercontent.com/nvkelso/natural-earth-vector/refs/heads/master/geojson/ne_110m_land.geojson\", {cache: true})\n\nconst land = rewind(await response.json(), {reverse: true})\n\ndisplay({points, land})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"const pointNames = d3.rollups(points.features, (d) => d.map((d) => d.properties.name_in_lang), (v) => v.id)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"## Imports and Styling","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"import {rewind} from \"npm:@turf/rewind\";","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4e","stdlib":"2"}} 24:null