34:["$","title",null,{"children":"Mollie’s Copy - Updating some map features… | molliewebb | Observable"}] 3c:T617,## About this notebook Identify US parks that resemble the geoembedded profile of 20 candidate food forests, then explore one park in detail (Laclede Park in Saint Louis, MO). **Data sources** | Layer | File | Notes | |---|---|---| | Candidate sites | `potential_sites_us_85pct_similar.csv` | 454 H3 hexes ≥ 85% embedding similarity to candidate food forests | | Park polygons | `potential_sites_us_85pct_similiar_parks_polygons.geojson` | GeoJSON: 2,253 parks intersecting those hexes | | Park centroids | `potential_sites_us_85pct_similar_intersecting_parks_pts.csv` | One point per park polygon | | Park features | `laclede_park_boundary.geojson`, `contours_1m.geojson`, `census_blocks_surrounding_laclede_park.geojson`, `city_trees_within_laclede_park.csv` | Park boundary, contours, census blocks, tree locations | | Elevation | `dem2017_1m.tif` | 1 m DEM | | State boundaries | [us-atlas](https://github.com/topojson/us-atlas) `states-10m.json` | TopoJSON | **Join logic:** Park points carry no city/state. Their `ORIG_FID` refers to park polygons rather than candidate hexes. Therefore, each park takes the city, county, and state of its **nearest candidate hex centroid** (med. distance ~1 km; see `joinDistanceKm`). **Data notes** - Source polygons use RFC 7946 (counter-clockwise) winding. This notebook rewinds them when loaded for D3. - Trees with no or zero `DBH` are drawn as gray "x" marks. There are six "vacant" records with a `DBH`. - Hillshade uses 4x vertical exaggeration by default. This is because the park's relief is only ~5 m.3d:T717,attachmentStatus = { const files = [ ["potential_sites_us_85pct_similar.csv", () => FileAttachment("potential_sites_us_85pct_similar.csv")], ["potential_sites_us_85pct_similiar_parks_polygons.geojson", () => FileAttachment("potential_sites_us_85_pct_similiar_parks_polygons.geojson")], ["potential_sites_us_85pct_similar_intersecting_parks_pts.csv", () => FileAttachment("potential_sites_us_85pct_similar_intersecting_parks_pts.csv")], ["laclede_park_boundary.geojson", () => FileAttachment("laclede_park_boundary.geojson")], ["contours_1m.geojson", () => FileAttachment("contours_1m.geojson")], ["census_blocks_surrounding_laclede_park.geojson", () => FileAttachment("census_blocks_surrounding_laclede_park.geojson")], ["city_trees_within_laclede_park.csv", () => FileAttachment("city_trees_within_laclede_park.csv")], ["dem2017_1m.tif", () => FileAttachment("dem2017_1m.tif")] ]; const results = await Promise.all( files.map(async ([name, attach]) => { try { await attach().url(); return {name, ok: true}; } catch { return {name, ok: false}; } }) ); const missing = results.filter((d) => !d.ok); return html`

${missing.length ? html`${missing.length} of ${results.length} attachments missing. Attach these from d3_UrbanFoodForests/data/ with the exact filenames (cells that depend on them will show errors until then):

${d.name}

` : html`All ${results.length} data attachments found.`}

`; }3e:T4ea,SitesByStateChart = { const chart = Plot.plot({ width, height: 200, marginTop: 20, x: {label: null, domain: sitesByState.map((d) => d.state), tickFormat: (s) => stateAbbr.get(s) ?? s}, y: {label: "Candidate sites", grid: true, ticks: 4}, marks: [ Plot.barY(sitesByState, { x: "state", y: "count", fill: (d) => (d.state === focusState ? "blue" : "#ccc"), fillOpacity: (d) => (focusState && d.state !== focusState ? 0.4 : 0.85), title: (d) => `${d.state}: ${d.count} sites`, tip: {pointer: "x"} }), Plot.text(sitesByState, {x: "state", y: "count", text: "count", dy: -6, fontSize: 9}), Plot.barY(sitesByState, Plot.pointerX({x: "state", y: "count", fill: "none", stroke: "#111", strokeWidth: 1.5})), Plot.ruleY([0]) ] }); chart.style.cursor = "pointer"; chart.addEventListener("click", () => { const state = chart.value?.state; if (!state || state === focusState) { mutable focusState = null; return; } if (viewof citySelect.value !== null) { viewof citySelect.value = null; viewof citySelect.dispatchEvent(new Event("input", {bubbles: true})); } mutable focusState = state; }); return chart; }3f:T1125,NationalMap = { const height = Math.round(width * 0.62); const pad = 20; const dx = pad - (width * (zoomLevel - 1)) / 2; const dy = pad - (height * (zoomLevel - 1)) / 2; // MW - Adjust the center focus of the Zoom // Roughly how many degrees of longitude are visible right now const [[x0], [x1]] = d3.geoBounds(mapDomain); const lonSpan = ((x1 - x0 + 360) % 360) / zoomLevel; const showContext = lonSpan < 20; // tweak this threshold to taste const [lon, lat] = d3.geoCentroid(mapDomain); const rotate = projectionType === "albers-usa" ? undefined : projectionType === "orthographic" ? [-lon, -lat] : [-lon, 0]; // MW ADD END // return Plot.plot({ // MW commented out const plot = Plot.plot({ // MW ADD width, height, style: {overflow: "hidden"}, projection: { type: projectionType, domain: mapDomain, ...(rotate && {rotate}), insetLeft: dx + pan[0], // MW ADD insetRight: dx - pan[0], // MW ADD insetTop: dy + pan[1], // MW ADD insetBottom: dy - pan[1] // MW ADD }, marks: [ projectionType === "albers-usa" ? null : Plot.sphere({fill: "#ffffff"}), Plot.geo(usStates, {fill: "#f4f1ea"}), showContext ? Plot.geo(usCountyMesh, {stroke: "#d6d0c4", strokeWidth: 0.4}) : null, // MW ADD showContext ? Plot.geo(usRoads, {stroke: "#e3a869", strokeWidth: 1, strokeOpacity: 0.8}) : null, //MW ADD Plot.geo(usStateMesh, {stroke: "#bbb", strokeWidth: 0.6}), Plot.geo(filteredPolygons, { fill: "#2e7d32", fillOpacity: 0.35, stroke: "#2e7d32", strokeWidth: 0.5, title: (d) => `${d.properties.NAME}\n${d.properties.FEATTYPE} / ${d.properties.SQMI} sq mi`, tip: true }), Plot.dot(filteredPoints, { x: "longitude", y: "latitude", r: 3, fill: "none", stroke: "#1f6feb", strokeWidth: 1 }), // MW ADD - Show cities showContext ? Plot.dot(usCities, {x: "lon", y: "lat", r: 2, fill: "#333"}) : null, showContext ? Plot.text(usCities, { x: "lon", y: "lat", text: "name", dx: 5, textAnchor: "start", fontSize: 9, fill: "#333", stroke: "white", strokeWidth: 3, pointerEvents: "none" }) : null, // MW ADD END Plot.text( usStates.features, Plot.centroid({ text: (d) => stateAbbr.get(d.properties.name), fontSize: 10, fontWeight: "bold", fill: "#555", stroke: "white", strokeWidth: 3, pointerEvents: "none" }) ), Plot.dot([lacledeCentroid], {x: (d) => d[0], y: (d) => d[1], r: 6, stroke: "#d62728", strokeWidth: 2}), Plot.text([lacledeCentroid], { x: (d) => d[0], y: (d) => d[1], text: () => "Laclede Park", dx: 8, textAnchor: "start", fill: "#d62728", fontWeight: "bold", stroke: "white" }) ] }); // MW Add - Pan functionality // Wrapper that clips the map while it's being dragged const container = html`

`; container.append(plot); let start = null; container.addEventListener("pointerdown", (e) => { start = [e.clientX, e.clientY]; container.setPointerCapture(e.pointerId); container.style.cursor = "grabbing"; }); container.addEventListener("pointermove", (e) => { if (!start) return; // Slide the current map visually while dragging plot.style.transform = `translate(${e.clientX - start[0]}px, ${e.clientY - start[1]}px)`; }); container.addEventListener("pointerup", (e) => { if (!start) return; // Convert screen pixels to map pixels (the map may be scaled down on small screens) const k = width / plot.getBoundingClientRect().width; const mx = (e.clientX - start[0]) * k; const my = (e.clientY - start[1]) * k; start = null; container.style.cursor = "grab"; if (Math.abs(mx) + Math.abs(my) < 3) { plot.style.transform = ""; // just a click, not a drag return; } mutable pan = [pan[0] + mx, pan[1] + my]; // save the offset and redraw }); // Double-click to re-center container.addEventListener("dblclick", () => (mutable pan = [0, 0])); return container; }40:T870,ParkMap = { const show = new Set(parkLayers); const sized = parkTrees.filter((d) => d.DBH > 0); const unsized = parkTrees.filter((d) => !(d.DBH > 0)); return Plot.plot({ width, height: Math.round(width * 0.75), style: {overflow: "hidden"}, projection: {type: "mercator", domain: parkBoundary, inset: 40}, // Triangle height ∝ DBH: 0 in. → 0 px, max DBH (52 in.) → 60 px. Base width is fixed. length: {type: "linear", domain: [0, d3.max(sized, (d) => d.DBH)], range: [0, 80]}, color: {legend: show.has("Contours"), label: "Contour elevation (m)", scheme: "viridis"}, marks: [ show.has("Census blocks") ? Plot.geo(parkCensusBlocks, { fill: "transparent", fillOpacity: 0.25, stroke: "#ccc", strokeWidth: 0.8, title: (d) => `GEOID ${d.properties.GEOID}`, tip: false }) : null, Plot.geo(parkBoundary, {fill: "#e5f5e0", fillOpacity: 0.5, stroke: "#238b45", strokeWidth: 2.5}), showHillshade ? hillshadeMark(parkHillshade) : null, showHillshade ? Plot.geo(parkBoundary, {stroke: "#238b45", strokeWidth: 2.5}) : null, show.has("Contours") ? Plot.geo(parkContours, {stroke: (d) => d.properties.Contour, strokeWidth: 1}) : null, show.has("Trees") ? Plot.vector(d3.sort(sized, (d) => -d.latitude), { x: "longitude", y: "latitude", length: "DBH", anchor: "start", shape: treeSpike, r: 6, fill: {value: (d) => treeSpecies.color(treeSpecies.group(d.COMMON)), scale: null}, fillOpacity: 1, // stroke: "#333", strokeWidth: 0.75, title: (d) => `${d.COMMON}\nDBH ${d.DBH} in · ${d.CONDITION}\n${d.ADDRESS}`, tip: true }) : null, show.has("Trees") ? Plot.dot(unsized, { x: "longitude", y: "latitude", r: 3, symbol: "times", stroke: "#888", title: (d) => `${d.COMMON}\nNo DBH recorded · ${d.CONDITION}\n${d.ADDRESS}`, tip: true }) : null ] }); }41:T46a,const stateAbbr = new Map([ ["Alabama", "AL"], ["Alaska", "AK"], ["Arizona", "AZ"], ["Arkansas", "AR"], ["California", "CA"], ["Colorado", "CO"], ["Connecticut", "CT"], ["Delaware", "DE"], ["District of Columbia", "DC"], ["Florida", "FL"], ["Georgia", "GA"], ["Hawaii", "HI"], ["Idaho", "ID"], ["Illinois", "IL"], ["Indiana", "IN"], ["Iowa", "IA"], ["Kansas", "KS"], ["Kentucky", "KY"], ["Louisiana", "LA"], ["Maine", "ME"], ["Maryland", "MD"], ["Massachusetts", "MA"], ["Michigan", "MI"], ["Minnesota", "MN"], ["Mississippi", "MS"], ["Missouri", "MO"], ["Montana", "MT"], ["Nebraska", "NE"], ["Nevada", "NV"], ["New Hampshire", "NH"], ["New Jersey", "NJ"], ["New Mexico", "NM"], ["New York", "NY"], ["North Carolina", "NC"], ["North Dakota", "ND"], ["Ohio", "OH"], ["Oklahoma", "OK"], ["Oregon", "OR"], ["Pennsylvania", "PA"], ["Rhode Island", "RI"], ["South Carolina", "SC"], ["South Dakota", "SD"], ["Tennessee", "TN"], ["Texas", "TX"], ["Utah", "UT"], ["Vermont", "VT"], ["Virginia", "VA"], ["Washington", "WA"], ["West Virginia", "WV"], ["Wisconsin", "WI"], ["Wyoming", "WY"], ["Puerto Rico", "PR"] ])42:T596,parkHillshade = { const {width: w, height: h, values, resolution: [rx], isValid} = parkDem; const zenith = Math.PI / 4; const azimuth = ((360 - 315 + 90) % 360) * (Math.PI / 180); const canvas = Object.assign(document.createElement("canvas"), {width: w, height: h}); const ctx = canvas.getContext("2d"); const img = ctx.createImageData(w, h); for (let j = 0; j < h; ++j) { for (let i = 0; i < w; ++i) { const e = values[j * w + i]; if (!isValid(e)) continue; const z = (di, dj) => { const x = i + di, y = j + dj; const v = x >= 0 && x < w && y >= 0 && y < h ? values[y * w + x] : NaN; return isValid(v) ? v : e; }; const [a, b, c, d, f, g, hh, k] = [z(-1, -1), z(0, -1), z(1, -1), z(-1, 0), z(1, 0), z(-1, 1), z(0, 1), z(1, 1)]; const dzdx = ((c + 2 * f + k) - (a + 2 * d + g)) / (8 * rx); const dzdy = ((g + 2 * hh + k) - (a + 2 * b + c)) / (8 * rx); const slope = Math.atan(hillshadeZFactor * Math.hypot(dzdx, dzdy)); const aspect = Math.atan2(dzdy, -dzdx); const shade = Math.cos(zenith) * Math.cos(slope) + Math.sin(zenith) * Math.sin(slope) * Math.cos(azimuth - aspect); const gray = Math.round(255 * Math.max(0, shade)); const p = 4 * (j * w + i); img.data[p] = img.data[p + 1] = img.data[p + 2] = gray; img.data[p + 3] = 255; } } ctx.putImageData(img, 0, 0); return canvas.toDataURL(); }43:T4fe,hillshadeMark = (href, {opacity = 0.65} = {}) => (index, scales, values, dimensions, context) => { const {width: w, height: h, origin: [x0, y0], resolution: [rx, ry]} = parkDem; const toLonLat = proj4("EPSG:26915", "EPSG:4326").forward; const project = ([x, y]) => { let p; const sink = {point: (px, py) => (p = [px, py]), lineStart() {}, lineEnd() {}, polygonStart() {}, polygonEnd() {}, sphere() {}}; context.projection.stream(sink).point(...toLonLat([x, y])); return p; }; const tl = project([x0, y0]); const tr = project([x0 + w * rx, y0]); const bl = project([x0, y0 + h * ry]); const g = context.document.createElementNS("http://www.w3.org/2000/svg", "g"); if (!tl || !tr || !bl) return g; const image = context.document.createElementNS("http://www.w3.org/2000/svg", "image"); image.setAttribute("href", href); image.setAttribute("width", w); image.setAttribute("height", h); image.setAttribute("preserveAspectRatio", "none"); image.setAttribute("opacity", opacity); image.setAttribute("style", "mix-blend-mode: multiply"); image.setAttribute( "transform", `matrix(${(tr[0] - tl[0]) / w} ${(tr[1] - tl[1]) / w} ${(bl[0] - tl[0]) / h} ${(bl[1] - tl[1]) / h} ${tl[0]} ${tl[1]})` ); g.append(image); return g; }44:[{"id":"f35caeb7cf89540e7150a32adc323d6cb12d9f8aebbaed9ca9d47dbe3e49eab603014a1ddff8be0b5cdeaf06882e03a3f7815f8761ec52bc66dab606eba66bb2","href":"https://static.observableusercontent.com/files/f35caeb7cf89540e7150a32adc323d6cb12d9f8aebbaed9ca9d47dbe3e49eab603014a1ddff8be0b5cdeaf06882e03a3f7815f8761ec52bc66dab606eba66bb2","name":"census_blocks_surrounding_laclede_park.geojson","type":"application/geo+json","lastModified":1792009092529,"size":17266},{"id":"72a042b9809ba44f433aa9136a64ef2145a34bfac4ff716b72e4f80346e5dbd5a0e8d6bb46aa91f1c38c7e877c92730975d98b4c9edf01f6a16c06a41a19413a","href":"https://static.observableusercontent.com/files/72a042b9809ba44f433aa9136a64ef2145a34bfac4ff716b72e4f80346e5dbd5a0e8d6bb46aa91f1c38c7e877c92730975d98b4c9edf01f6a16c06a41a19413a","name":"city_trees_within_laclede_park.csv","type":"text/csv","lastModified":1792009092536,"size":14877},{"id":"7aad17a12b5c2a230d8db50cc580e18a71a224d2101f5db7fa2c0820f4ad8c92e3be5dc76428042a57bd60939bb205b34df33c98797418834dee2e68aab1e44f","href":"https://static.observableusercontent.com/files/7aad17a12b5c2a230d8db50cc580e18a71a224d2101f5db7fa2c0820f4ad8c92e3be5dc76428042a57bd60939bb205b34df33c98797418834dee2e68aab1e44f","name":"contours_1m.geojson","type":"application/geo+json","lastModified":1792009092541,"size":250827},{"id":"22a660f2976dc9c2ad0929db583a1a4a438a560fd577fa98f6ab893469266b17f0886f976f867e84de45c98613de0be75f826655cd2d88e68c860d51fa1f536a","href":"https://static.observableusercontent.com/files/22a660f2976dc9c2ad0929db583a1a4a438a560fd577fa98f6ab893469266b17f0886f976f867e84de45c98613de0be75f826655cd2d88e68c860d51fa1f536a","name":"dem2017_1m.tfw","type":"application/octet-stream","lastModified":1790259952000,"size":90},{"id":"df9d06c5d981c2921e49d6c46326a0d6b6343e4c42333cd7c9f10903d90c6198d10388eddc87792d41e481adc7db7ad4dbdd6763d38daf9d88d73342664415eb","href":"https://static.observableusercontent.com/files/df9d06c5d981c2921e49d6c46326a0d6b6343e4c42333cd7c9f10903d90c6198d10388eddc87792d41e481adc7db7ad4dbdd6763d38daf9d88d73342664415eb","name":"dem2017_1m.tif","type":"image/tiff","lastModified":1792009092542,"size":86873},{"id":"9046dea1eb87ec74360fe460c5bd4fee7a99e91312a19975e010b4149874f44720223a1b86e0cb9b822f8aff869c33fbecc316c737f2efe67c0a5bcb0875fae5","href":"https://static.observableusercontent.com/files/9046dea1eb87ec74360fe460c5bd4fee7a99e91312a19975e010b4149874f44720223a1b86e0cb9b822f8aff869c33fbecc316c737f2efe67c0a5bcb0875fae5","name":"dem2017_1m.tif.aux.xml","type":"text/xml","lastModified":1792009092543,"size":640},{"id":"de6ef4a2d5fb7fa142175be4dfff39264d4e00a04f477cb3ce965795ce6d8d01bd672b943d6a0f745d0dfab918047c62ca359346030593b00a9dbe23cb53ae77","href":"https://static.observableusercontent.com/files/de6ef4a2d5fb7fa142175be4dfff39264d4e00a04f477cb3ce965795ce6d8d01bd672b943d6a0f745d0dfab918047c62ca359346030593b00a9dbe23cb53ae77","name":"dem2017_1m.tif.xml","type":"text/xml","lastModified":1792009092543,"size":10164},{"id":"55421d8a597e418c84e22817c5bd1b73748792a2c0031e1182252668dd20e8000cacea328b2226ac22497ed1d6417aafeb6e7f9218bef85cb6a378a38923b1ae","href":"https://static.observableusercontent.com/files/55421d8a597e418c84e22817c5bd1b73748792a2c0031e1182252668dd20e8000cacea328b2226ac22497ed1d6417aafeb6e7f9218bef85cb6a378a38923b1ae","name":"laclede_park_boundary.geojson","type":"application/geo+json","lastModified":1792009092544,"size":938},{"id":"bf6f9abb1027bc21cbcd1781428e5d54de86a300e1eea63c9075a0bfd81a02734d7de6cac90a148a5574bd4d7ba56152d01c5bebca902d32f09799047624287e","href":"https://static.observableusercontent.com/files/bf6f9abb1027bc21cbcd1781428e5d54de86a300e1eea63c9075a0bfd81a02734d7de6cac90a148a5574bd4d7ba56152d01c5bebca902d32f09799047624287e","name":"potential_sites_us_85pct_similar.csv","type":"text/csv","lastModified":1792009092550,"size":1416327},{"id":"4e6af9a2c6a4ba23eecac45849d896986714f4bb50fd191a89494a13189393a1df91d124598c93f4150913b16e3d451212db723c1c0db557f3a5f6e1055af7df","href":"https://static.observableusercontent.com/files/4e6af9a2c6a4ba23eecac45849d896986714f4bb50fd191a89494a13189393a1df91d124598c93f4150913b16e3d451212db723c1c0db557f3a5f6e1055af7df","name":"potential_sites_us_85pct_similar_intersecting_parks_pts.csv","type":"text/csv","lastModified":1792009092553,"size":184371},{"id":"a64670a2a849a2f3123edb1e1be12b8d28099ae2796087cfbc42a4733947296c176b4299fdf9632e1ee926484f105b3c75b140ed3951b9f68adb466b4ec00941","href":"https://static.observableusercontent.com/files/a64670a2a849a2f3123edb1e1be12b8d28099ae2796087cfbc42a4733947296c176b4299fdf9632e1ee926484f105b3c75b140ed3951b9f68adb466b4ec00941","name":"potential_sites_us_85_pct_similiar_parks_polygons.geojson","type":"application/geo+json","lastModified":1792009092548,"size":5900549}] 38:{"id":"94db935cbcdeb099","slug":"mollies-copy-updating-some-map-features","title":"Mollie’s Copy - Updating some map features…","thumbnail":"1f8dff9b491b1f7b32fbdce61f9bbe32b051d22bace1fb992590a82590821694","access_level":"public","create_time":"$D2026-10-16T14:20:21.197Z","update_time":"$D2026-10-16T19:28:03.258Z","view_time":null,"first_public_time":"$D2026-10-22T12:15:28.337Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"1cfad49fafe09a6f","login":"molliewebb","name":"molliewebb","avatar_url":null,"tier":"free_2026","bio":"","followed_by_you":false,"follows_you":false},"version":1381,"publish_version":1381,"role":null,"authored":false,"authors":[{"type":"individual","id":"15b1889e955c0fe4","login":"molliewebb","name":"molliewebb","avatar_url":null,"tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"team","id":"1cfad49fafe09a6f","login":"molliewebb","name":"molliewebb","avatar_url":null,"tier":"free_2026","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Mollie’s Copy - Updating some map features…","cells":[{"id":1,"value":"# Mollie's Copy - Updating some map features....\n- Included county boundaries, city points and interstate lines when map zooms\n- Add a pan function to the map\n- Adjusted zoom focal point to the current extent\n# Geoembeddings & Interactive Mapping for Urban Food Forests\n## Demo Notebook","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"By Tim Zielonko & Mollie Webb | Washington University in St. Louis\n
Presented 11/17/2026","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":102,"value":"## Data preparation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"### Joining city/state on park points\n\n`siteIntersect.ORIG_FID` is the park polygon's `OBJECTID`, not a `siteCandidates` key, so an\n`ORIG_FID` join matches nothing. Instead, each park centroid takes the geography of its\n**nearest candidate hex centroid** (using a great-circle distance). Median distance is ~1 km and `joinDistanceKm` is kept to inspect outliers.\n\nAdmin hierarchy in `siteCandidates` is `ADMIN1_NAME` = country, `ADMIN2_NAME` = state,\n`ADMIN3_NAME` = county, `ADMIN4_NAME` = city.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"#### Check enrichment","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"const siteIntersectEnriched = siteIntersect.map((p) => {\n const pt = [p.longitude, p.latitude];\n const distance = (s) => d3.geoDistance(pt, [s.longitude, s.latitude]);\n const nearest = d3.least(siteCandidates, distance);\n return {\n ...p,\n ADMIN1_NAME: nearest.ADMIN1_NAME,\n ADMIN2_NAME: nearest.ADMIN2_NAME,\n ADMIN3_NAME: nearest.ADMIN3_NAME,\n ADMIN4_NAME: nearest.ADMIN4_NAME,\n city: `${nearest.ADMIN4_NAME}, ${nearest.ADMIN2_NAME}`,\n nearestSiteId: nearest.ID,\n joinDistanceKm: distance(nearest) * 6371\n };\n})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"#### Data check","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"const dataSummary = ({\n siteCandidates: siteCandidates.length,\n sitePolygons: sitePolygons.features.length,\n siteIntersect: siteIntersect.length,\n cities: cityOptions.length,\n stLouisParks: siteIntersectEnriched.filter((d) => d.city === \"Saint Louis, Missouri\").length,\n maxJoinDistanceKm: d3.max(siteIntersectEnriched, (d) => d.joinDistanceKm),\n parkBoundaryName: parkBoundary.features[0].properties.NAME,\n parkContours: parkContours.features.length,\n parkCensusBlocks: parkCensusBlocks.features.length,\n parkTrees: parkTrees.length\n})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"dataSummary","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"## National map\n\nGreen shapes are park boundaries intersecting 85% similarity hexes (`sitePolygons`). Blue rings\nare their centroids (`siteIntersect`). Parks are small at national scale: hover near a ring to see\nthe park's name, type, and area. State boundaries are from [us-atlas](https://github.com/topojson/us-atlas)\n`states-10m.json`.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"### Candidate sites by state\n\nCount of unique 85% similarity hex sites (`siteCandidates`) per state. **Click a bar** to focus\nthe national map on that state. Use the map's **Reset** button to return to the full view.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":106,"value":"// MW - Add county boundary object\nusCountyMesh = {\n const us = await d3.json(\"https://cdn.jsdelivr.net/npm/us-atlas@3/counties-10m.json\");\n // Interior county borders only (skips borders that are also state lines)\n return topojson.mesh(us, us.objects.counties, (a, b) => a !== b && (a.id / 1000 | 0) === (b.id / 1000 | 0));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":107,"value":"// MW - Add city points object\nusCities = {\n const places = await d3.json(\n \"https://cdn.jsdelivr.net/gh/nvkelso/natural-earth-vector@master/geojson/ne_10m_populated_places_simple.geojson\"\n );\n return places.features\n .filter((d) => d.properties.adm0_a3 === \"USA\" && d.properties.pop_max >= 50000)\n .map((d) => ({\n name: d.properties.name,\n lon: d.geometry.coordinates[0],\n lat: d.geometry.coordinates[1],\n pop: d.properties.pop_max\n }));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"// MW - Add roads polyline object\nusRoads = {\n const roads = await d3.json(\n \"https://raw.githubusercontent.com/nvkelso/natural-earth-vector/master/geojson/ne_10m_roads.geojson\"\n );\n return {\n type: \"FeatureCollection\",\n features: roads.features.filter(\n (d) => d.properties.sov_a3 === \"USA\" && d.properties.level === \"Interstate\"\n )\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"// MW - Setting up the pan\nmutable pan = [0, 0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"html`

${viewof citySelect}

${viewof projectionType}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"mapControls = {\n const button = (label, onclick) => {\n const b = html``;\n b.onclick = onclick;\n return b;\n };\n return html`

${[\n button(\"Zoom in\", () => (mutable zoomLevel = Math.min(mutable zoomLevel * 1.5, 64))),\n button(\"Zoom out\", () => (mutable zoomLevel = Math.max(mutable zoomLevel / 1.5, 0.25))),\n button(\"Reset\", () => {\n mutable focusState = null;\n mutable zoomLevel = 1;\n viewof citySelect.value = null;\n viewof citySelect.dispatchEvent(new Event(\"input\", {bubbles: true}));\n })\n ]}

`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"const usAtlas = d3.json(\"https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json\")","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"const usStates = topojson.feature(usAtlas, usAtlas.objects.states)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"const usStateMesh = topojson.mesh(usAtlas, usAtlas.objects.states, (a, b) => a !== b)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"const lacledeCentroid = d3.geoCentroid(parkBoundary)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"viewof projectionType = Inputs.select(\n new Map([\n [\"Albers USA\", \"albers-usa\"],\n [\"Equal Earth\", \"equal-earth\"],\n [\"Mercator\", \"mercator\"],\n [\"Orthographic\", \"orthographic\"]\n ]),\n {label: \"Projection\"}\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"viewof citySelect = Inputs.select([null, ...cityOptions], {\n label: \"City\",\n format: (d) => d ?? \"All cities\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":68,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"## Further exploration\n\nAdditional charts...","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"### Similarity histogram","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"Plot.plot({\n width,\n height: 220,\n x: {label: \"Similarity to Laclede Park\"},\n y: {label: \"Candidate sites\", grid: true},\n marks: [\n Plot.rectY(siteCandidates, Plot.binX({y: \"count\"}, {\n x: \"SIMILARITY\",\n fill: \"#ccc\",\n fillOpacity: 0.6,\n thresholds: 30\n })),\n Plot.ruleX(siteCandidates.filter((d) => d.ADMIN2_NAME === \"Missouri\"), {\n x: \"SIMILARITY\",\n stroke: \"#d62728\",\n strokeWidth: 2,\n title: (d) => `${d.ADMIN4_NAME}, MO\\nSimilarity ${d.SIMILARITY.toFixed(3)}`,\n tip: true\n }),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"### Similarity to Census-reported local income","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"Plot.plot({\n width,\n height: 300,\n x: {label: \"Median household income (ACS, $)\", type: \"log\", tickFormat: \"$~s\"},\n y: {label: \"Similarity\", grid: true},\n r: {range: [2, 10], label: \"Population\"},\n color: {domain: [\"Missouri\", \"Other states\"], range: [\"#d62728\", \"#9e9e9e\"], legend: true},\n marks: [\n Plot.dot(siteCandidates, {\n x: \"ACSMEDHINC\",\n y: \"SIMILARITY\",\n r: \"ACSTOTPOP\",\n fill: (d) => (d.ADMIN2_NAME === \"Missouri\" ? \"Missouri\" : \"Other states\"),\n fillOpacity: 0.6,\n sort: (d) => d.ADMIN2_NAME === \"Missouri\",\n title: (d) => `${d.ADMIN4_NAME}, ${d.ADMIN2_NAME}\\nIncome $${d3.format(\",\")(d.ACSMEDHINC)} · Pop ${d3.format(\",\")(d.ACSTOTPOP)}\\nSimilarity ${d.SIMILARITY.toFixed(3)}`,\n tip: true\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"### Tree quality","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"Plot.plot({\n height: 140,\n marginLeft: 60,\n x: {label: \"Trees\", grid: true},\n y: {label: null},\n marks: [\n Plot.barX(parkTrees, Plot.groupY({x: \"count\"}, {y: \"CONDITION\", fill: \"#ccc\", sort: {y: \"-x\"}})),\n Plot.text(parkTrees, Plot.groupY({x: \"count\", text: \"count\"}, {y: \"CONDITION\", dx: 4, textAnchor: \"start\"})),\n Plot.ruleX([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"### Sites","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"const siteCandidates = (await FileAttachment(\"potential_sites_us_85pct_similar.csv\").csv({typed: true}))\n .map((d) => ({...d, latitude: +d.lat, longitude: +d.long}))","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"const rewind = (collection) => ({\n ...collection,\n features: collection.features.map((f) => {\n const {type, coordinates} = f.geometry;\n const flip = (rings) => rings.map((ring) => ring.slice().reverse());\n if (type === \"Polygon\") return {...f, geometry: {type, coordinates: flip(coordinates)}};\n if (type === \"MultiPolygon\") return {...f, geometry: {type, coordinates: coordinates.map(flip)}};\n return f;\n })\n})","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"const sitePolygons = rewind(await FileAttachment(\"potential_sites_us_85_pct_similiar_parks_polygons.geojson\").json())","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"const siteIntersect = (await FileAttachment(\"potential_sites_us_85pct_similar_intersecting_parks_pts.csv\").csv({typed: true}))\n .map((d) => ({...d, latitude: +d.lat, longitude: +d.long}))","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"sitesByState = d3\n .rollups(siteCandidates, (v) => new Set(v.map((d) => d.ID)).size, (d) => d.ADMIN2_NAME)\n .map(([state, count]) => ({state, count}))\n .sort((a, b) => d3.descending(a.count, b.count) || d3.ascending(a.state, b.state))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"### Supplemental data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"const parkBoundary = rewind(await FileAttachment(\"laclede_park_boundary.geojson\").json())","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"const parkContours = FileAttachment(\"contours_1m.geojson\").json()","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"const parkCensusBlocks = rewind(await FileAttachment(\"census_blocks_surrounding_laclede_park.geojson\").json())","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"const parkTrees = (await FileAttachment(\"city_trees_within_laclede_park.csv\").csv({typed: true}))\n .map((d) => ({...d, latitude: +d.lat, longitude: +d.long}))","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"const parkImg = FileAttachment(\"dem2017_1m.tif.xml\")","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"const cityOptions = Array.from(new Set(siteIntersectEnriched.map((d) => d.city))).sort(d3.ascending)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"### Utilities: Laclede Park","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"GeoTIFF = import(\"https://cdn.jsdelivr.net/npm/geotiff@2.1.3/+esm\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"proj4 = {\n const {default: proj4} = await import(\"https://cdn.jsdelivr.net/npm/proj4@2.12.1/+esm\");\n proj4.defs(\"EPSG:26915\", \"+proj=utm +zone=15 +datum=NAD83 +units=m +no_defs\");\n return proj4;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"parkDem = {\n const tiff = await GeoTIFF.fromArrayBuffer(await FileAttachment(\"dem2017_1m.tif\").arrayBuffer());\n const image = await tiff.getImage();\n const [values] = await image.readRasters();\n const noData = image.getGDALNoData();\n return {\n width: image.getWidth(),\n height: image.getHeight(),\n values,\n origin: image.getOrigin(), // top-left corner, UTM metres\n resolution: image.getResolution(), // [1, -1]\n isValid: (v) => Number.isFinite(v) && v !== noData && v < 1e30\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"$42","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"$43","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"treeSpecies = {\n const counts = d3.rollups(parkTrees.filter((d) => d.DBH > 0), (v) => v.length, (d) => d.COMMON)\n .sort(([a, m], [b, n]) => d3.descending(m, n) || d3.ascending(a, b));\n const top = counts.slice(0, 9).map(([name]) => name);\n const otherCount = d3.sum(counts.slice(9), ([, n]) => n);\n const group = (name) => (top.includes(name) ? name : \"Other\");\n const domain = otherCount ? [...top, \"Other\"] : top;\n const count = new Map([...counts.slice(0, 9), [\"Other\", otherCount]]);\n const color = d3.scaleOrdinal(domain, [...d3.schemeTableau10.filter((c) => c !== \"#bab0ac\"), \"#bab0ac\"]);\n return {group, domain, count, color};\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":113,"value":"## Testing OSM Basemap","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"map = {\n // Create a container for the map\n const container = html`

`;\n yield container; // put it on the page first so Leaflet can measure its size\n\n // Create the map and zoom to the contiguous US\n const map = L.map(container).fitBounds([\n [24.5, -125.0], // southwest corner\n [49.5, -66.9] // northeast corner\n ]);\n\n // Add the OpenStreetMap basemap\n L.tileLayer(\"https://tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n maxZoom: 19,\n attribution: '© OpenStreetMap contributors'\n }).addTo(map);\n\n // Clean up the old map when the cell re-runs\n invalidation.then(() => map.remove());\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W44","stdlib":"2"}} 33:null