28:null 29:["$","title",null,{"children":"Baarle-Hertog & Baarle-Nassau | Allmaps | Observable"}] 2e:T8eb,The 2024 [FOSS4G BE+NL conference](https://foss4g.be/en/index.php) will be held in Baarle-Hertog & Baarle-Nassau, a very suitable location for a conference for cartography geeks due to the world-famous enclaves! During the preparation of our [talk](https://foss4g.be/en/talk/allmaps-open-source-tools-for-curating-georeferencing-and-exploring-iiif-maps.php), we were curious if we could trace the boundaries of the current enclaves on historical maps using Allmaps's open source tools. This would help us to understand the current borders that run through parcels and buildings. The history of the borders is interesting and long. They were codified in text and maps at different moments in time and with varying legal validity. We focus on the early 19th century, when, after the Belgian Revolution, the border between the Netherlands and Belgium was settled in the Treaty of Maastricht (1843). Except in Baarle, were the border was interrupted between pillar 214 and 215. For each of the 5.732 parcels in the municipalities the nationality was determined in the Communal Minute of 29 November 1836. As a guide for this work, the cadastral ledger and plans (1:2500) were used that were made between 1811-1832. On those plans, the Belgian parcels had already been colored. The plans and ledgers of the 1832 cadaster have been digitized as part of the [HisGIS](https://hisgis.nl/over-ons/) project and the images can be found in the [image archive](https://beeldbank.cultureelerfgoed.nl/) of the Cultural Heritage Agency of the Netherlands, and accessed using the [IIIF Image API](https://iiif.io/). For this Notebook, we georeferenced a selection of the sheets for Baarle using Allmaps Editor and queried OpenStreetMap for the exact boundaries of the enclaves. We combined this data in a Leaflet map below, which allows you to compare the current boundaries to their 19th century counterparts. Of course, many caveats apply to this presentation. To highlight two: (1) the current boundaries were only determined in 1995 based on multiple sources, among which the original cadastral plans, and (2) distortions of the original plans, the quality of the manual georeferencing and the chosen transformation algorithm all determine the accuracy of the rendering of the historical maps.2f:T87a,## Sources **General** - ["En territoire belge et à quarante centimètres de la frontière": an historical and documentary study of the Belgian and Dutch enclaves of Baarle-Hertog and Baarle-Nassau](http://hdl.handle.net/11343/28979) - [The Baarle Enclaves](https://www.grenspalen.nl/archief/baarle-nassau-in-english.html) - [Geschiedenis van de Enclaves](https://www.amaliavansolms.org/geschiedenis/) - [Overeenkomst tussen het Koninkrijk der Nederlanden en het Koninkrijk België betreffende de grensscheiding, met Reglement voor het plaatsen van grenspalen](https://verdragenbank.overheid.nl/nl/Treaty/Details/001294.html) - [Proces-Verbaal van afbakening van de Rijksgrens tussen het Koninkrijk der Nederlanden en het Koninkrijk België (...)](https://verdragenbank.overheid.nl/nl/Treaty/Details/002268.html) - Wikipedia [Baarle-Hertog](https://en.wikipedia.org/wiki/Baarle-Hertog) & [Baarle-Nassau](https://en.wikipedia.org/wiki/Baarle-Nassau) - [Visit Baarle: History](https://en.visitbaarle.com/informatie/geschiedenis) - [Visit Baarle: Facts about enclaves](https://drive.google.com/file/d/1TS-Sn7cPqPxB-WNxHz-hpqrs7L6NR0qc/view) **Historical Documents** **Historical Maps** Kadastrale kaarten 1811-1832 (via Beeldbank Cultureel Erfgoed RCE/HisGIS): - [Zoekresultaten Baarle](https://beeldbank.cultureelerfgoed.nl/rce-mediabank/?mode=gallery&view=horizontal&q=baarle&fq%5B%5D=search_s_entity_name:%22Kadastrale%20kaarten%22&sort=order_s_objectnummer%20asc&rows=25&page=1) - [Verzamelplan](https://beeldbank.cultureelerfgoed.nl/rce-mediabank/detail/997dcc78-94d7-11e5-ac13-f79508ac39e8/media/8f5e7c1b-3c2d-ac3b-333d-7c636d4c6333?mode=detail&view=horizontal&q=baarle&rows=1&page=41&fq%5B%5D=search_s_entity_name:%22Kadastrale%20kaarten%22&sort=order_s_objectnummer%20asc) [Bonnebladen](https://observablehq.com/@allmaps/bonnebladen) (Nationaal Archief) - 687 Baarle-Nassau - 666 Alphen N.B. [TMK](https://viewer.allmaps.org/?url=https%3A%2F%2Fraw.githubusercontent.com%2Fbmmeijers%2Fiiif-annotations%2Fmain%2Fseries%2Ftmk%2F20231124.json) (TU Delft) - Blad 50 **GeoJson** - OpenStreetMap - GemeenteGeschiedenis: https://gemeentegeschiedenis.nl/amco/1006030:Tbaf,svg = ({ allmaps: ``, iiif: ``, link: `` })31:[{"id":"2da10e81ae108fa98a3a048b6b88a92a1aa2adc481a20551fa92168b393fcc643ea7c1403263e85e2a962575d17a54f5cfd1410e70f30c24459879b593616afa","href":"https://static.observableusercontent.com/files/2da10e81ae108fa98a3a048b6b88a92a1aa2adc481a20551fa92168b393fcc643ea7c1403263e85e2a962575d17a54f5cfd1410e70f30c24459879b593616afa","name":"rce_baarle.json","type":"application/json","lastModified":1726063188218.978,"size":933159},{"id":"ce2ea8f84bbc8282e7f43f91758613ad45fcb0bf94f9c7f96d4c9eda806542766ed5153fd11997cfd5ccf974c5766a0f3126f043937910122b9218c5a8af791d","href":"https://static.observableusercontent.com/files/ce2ea8f84bbc8282e7f43f91758613ad45fcb0bf94f9c7f96d4c9eda806542766ed5153fd11997cfd5ccf974c5766a0f3126f043937910122b9218c5a8af791d","name":"border_osm@3.geojson","type":"application/geo+json","lastModified":1727178803970.007,"size":71688},{"id":"7e0018835d4c6b9c7d44e2036603b6a450a0616e230fd1d6ab55bf12130a39bef655ef764e0b4bae9b59a10c0278a04c03bb50309bc53843099c36ca8840fc93","href":"https://static.observableusercontent.com/files/7e0018835d4c6b9c7d44e2036603b6a450a0616e230fd1d6ab55bf12130a39bef655ef764e0b4bae9b59a10c0278a04c03bb50309bc53843099c36ca8840fc93","name":"overpassOsm.json","type":"application/json","lastModified":1727256592501.88,"size":189533}] 2c:{"id":"4a7b34984b3bd4b8","slug":"baarle","title":"Baarle-Hertog & Baarle-Nassau","thumbnail":"104a0cd137a1990880d97c4d21a7b9e762933b665a3d7b425a328442af86e29b","access_level":"public","create_time":"$D2024-09-04T08:46:27.479Z","update_time":"$D2024-11-20T13:50:27.840Z","view_time":null,"first_public_time":"$D2024-09-24T07:22:50.189Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"8917b8f0b5bcd50a","login":"allmaps","name":"Allmaps","avatar_url":"https://avatars-next.observableusercontent.com/558e397531ba56d7134b2879485d93fba9d27c9b932e520cb72bea9bdd4133c7","tier":"starter_2024"},"version":1276,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f444e659497ac4e5","login":"sammeltassen","name":"Jules Schoonman","avatar_url":"https://avatars-next.observableusercontent.com/d8e1e715f8e8560d0970b3d60336fe11ce634dd18ec4107ab6e99022494e616c","tier":null},{"type":"individual","id":"6edbd541c72a1f56","login":"mclaeysb","name":"Manuel Claeys Bouuaert","avatar_url":"https://avatars-next.observableusercontent.com/889d708b9f3a10153ae462f64a458a10cdfaea8ed74bc1b6ea12b2926f0238a8","tier":null}],"members":[{"type":"team","id":"8917b8f0b5bcd50a","login":"allmaps","name":"Allmaps","avatar_url":"https://avatars-next.observableusercontent.com/558e397531ba56d7134b2879485d93fba9d27c9b932e520cb72bea9bdd4133c7","tier":"starter_2024","role":"editor"},{"type":"individual","id":"f444e659497ac4e5","login":"sammeltassen","name":"Jules Schoonman","avatar_url":"https://avatars-next.observableusercontent.com/d8e1e715f8e8560d0970b3d60336fe11ce634dd18ec4107ab6e99022494e616c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Baarle-Hertog & Baarle-Nassau","cells":[{"id":0,"value":"# Baarle-Hertog & Baarle-Nassau","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":350,"value":"$2e","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":392,"value":"viewof selectedEnclave = Inputs.select(\n [null].concat(osmGeoJson.features.filter((i) => i.properties.name)),\n {\n label: \"Go to\",\n format: (i) => i && `${i.properties.name}`\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":235,"value":"container = yield html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":948,"value":"_Some options for the Allmaps layer, to be removed later:_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":758,"value":"viewof opacity = Inputs.range([0.01, 1], {\n label: \"Opacity\",\n step: 0.01,\n value: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":880,"value":"viewof saturation = Inputs.range([0, 1], {\n label: \"Saturation\",\n step: 0.05,\n value: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":761,"value":"viewof threshold = Inputs.range([0, 0.3], {\n label: \"Remove background\",\n step: 0.01,\n value: 0\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":883,"value":"viewof hardness = Inputs.range([0.01, 1], {\n label: \"Hardness\",\n step: 0.01,\n value: 0.7\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":764,"value":"viewof hexColor = Inputs.color({\n label: \"Background color\",\n value: \"#eddbce\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":898,"value":"viewof colorize = Inputs.toggle({ label: \"Colorize\", value: false })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":861,"value":"viewof colorizeHexColor = Inputs.color({\n label: \"Colorize color\",\n value: \"#0000ff\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":327,"value":"[Open all cadastral maps in Allmaps Viewer](${allmapsViewerBase + sheetsAnnotationUrl})","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":178,"value":"$2f","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":82,"value":"## Georeferencing cadastral plans","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":202,"value":"Static import of the search results (in json, taken from the browser console) for \"Baarle\" in the collection of cadastral maps hosted by the RCE:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":30,"value":"rce_baarle = FileAttachment(\"rce_baarle.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":214,"value":"Filtering out the plans in the collection, cleaning up the response and constructing the IIIF Image API endpoints:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":36,"value":"minuutplans = rce_baarle.media\n .filter((i) => i.title.includes(\"plan\"))\n .map((i) => ({\n title: i.title,\n sectie: i.metadata.filter((i) => i.field === \"sectie\").shift()?.value,\n blad: i.metadata.filter((i) => i.field === \"blad\").shift()?.value,\n objectnummer: i.metadata.filter((i) => i.field === \"objectnummer\").shift()\n .value,\n iiif: \"https://images.memorix.nl/rce/iiif/\" + i.asset[0].uuid,\n geojson: JSON.parse(i.geodata[0][1].geojson),\n link: \"https://beeldbank.cultureelerfgoed.nl/rce-mediabank/detail/\" + i.id\n }))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"A IIIF Presentation Manifest of all plans was made using [this notebook](https://observablehq.com/d/46eb57ecfeded102). This allows us to load all sheets at once in Allmaps Editor.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"iiifManifest = \"https://sammeltassen.nl/iiif-manifests/rce/minuutplan-baarle@v2.json\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"[Open IIIF Manifest in Allmaps Editor](${allmapsEditorBase + iiifManifest})","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":374,"value":"Allmaps generates a Georeference Annotation that contains all the data for the plans georeferenced with Allmaps Editor","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":254,"value":"sheetsAnnotationUrl = \"https://annotations.allmaps.org/manifests/d0c97851f00118f2\"\n// With verzamelplan: https://annotations.allmaps.org/manifests/923471b3ec70e289","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":709,"value":"overviewAnnotationUrl = \"https://annotations.allmaps.org/images/fb921144c270698b\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":443,"value":"sheetsAnnotation = await fetchJson(sheetsAnnotationUrl)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":717,"value":"overviewAnnotation = await fetchJson(overviewAnnotationUrl)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":703,"value":"Create warpedMapLayers for sheets and verzamelplan and use `thinPlateSpline` transformation:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":539,"value":"sheetsWarpedMapLayer = {\n const layer = new allmapsLeaflet.WarpedMapLayer();\n const ids = await layer.addGeoreferenceAnnotation(sheetsAnnotation);\n layer.setMapsTransformationType(ids, \"thinPlateSpline\");\n return layer;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":720,"value":"overviewWarpedMapLayer = {\n const layer = new allmapsLeaflet.WarpedMapLayer();\n const ids = await layer.addGeoreferenceAnnotation(overviewAnnotation);\n layer.setMapsTransformationType(ids, \"thinPlateSpline\");\n return layer;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":658,"value":"Combined array of annotations, metadata and projected masks (from warpedMapLayer)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":573,"value":"georeferencedSheets = sheetsAnnotation.items\n .map((i) => {\n const id = i.id;\n const annotation = i;\n const iiif = i.target.source.id;\n const metadata = minuutplans.filter((i) => i.iiif === iiif).shift();\n const mask = sheetsWarpedMapLayer.getWarpedMap(id).geoMask;\n return { id, annotation, ...metadata, mask };\n })\n .sort((a, b) => (a.sectie + a.blad).localeCompare(b.sectie + b.blad))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":618,"value":"GeoJSON layers of plan outlines (provided by the RCE) and masks (of the georeferenced maps)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":600,"value":"maskGeoJson = ({\n type: \"FeatureCollection\",\n features: georeferencedSheets.map((i) => ({\n type: \"Feature\",\n properties: i,\n geometry: i.mask\n }))\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":983,"value":"rceGeoJson = ({\n type: \"FeatureCollection\",\n features: minuutplans\n .filter((i) => i.blad)\n .map((i) => ({\n type: \"Feature\",\n properties: i,\n geometry: i.geojson\n }))\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":683,"value":"maskGeoJsonlayer = L.geoJson(maskGeoJson, {\n style: {\n stroke: false,\n fillOpacity: 0\n },\n onEachFeature: (feature, layer) => {\n const props = feature.properties;\n const section = props.sectie;\n const sheet = props.blad;\n const link = props.link;\n const annotation = props.id;\n const iiif = props.iiif;\n layer.bindPopup(\n `

\n Kadastrale kaart (minuutplan)
\n Sectie ${section} Blad ${sheet}
\n ${\n svg.link\n } View in collection
\n ${\n svg.allmaps\n } Open in Allmaps Viewer
\n ${\n svg.iiif\n } Open IIIF Image API endpoint
\n

\n `\n );\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":985,"value":"rceGeoJsonlayer = L.geoJson(rceGeoJson, {\n style: {\n stroke: true,\n fillOpacity: 0.2\n },\n onEachFeature: (feature, layer) => {\n const props = feature.properties;\n const section = props.sectie;\n const sheet = props.blad;\n const link = props.link;\n const annotation = props.id;\n const iiif = props.iiif;\n layer.bindPopup(\n `

\n Kadastrale kaart (minuutplan)
\n Sectie ${section} Blad ${sheet}
\n ${\n svg.link\n } View in collection
\n ${\n svg.allmaps\n } Open in Allmaps Editor
\n ${\n svg.iiif\n } Open IIIF Image API endpoint
\n

\n `\n );\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":745,"value":"Combined layer (for layers control)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":742,"value":"sheetLayer = L.layerGroup([maskGeoJsonlayer, sheetsWarpedMapLayer])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":795,"value":"Processing warpedMapLayer options from inputs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":756,"value":"{\n if (sheetsWarpedMapLayer) {\n sheetsWarpedMapLayer.setOpacity(opacity);\n sheetsWarpedMapLayer.setSaturation(saturation);\n sheetsWarpedMapLayer.setRemoveColor({\n hexColor,\n threshold,\n hardness\n });\n if (colorize) {\n sheetsWarpedMapLayer.setColorize(colorizeHexColor);\n } else {\n sheetsWarpedMapLayer.resetColorize();\n }\n }\n\n return {\n opacity,\n saturation,\n hexColor,\n threshold,\n hardness,\n colorizeHexColor\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"## Obtaining GeoJSON exclaves data from OpenStreetMap","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":111,"value":"Enclaves in OpenStreetMap:\n- [How to tag](https://wiki.openstreetmap.org/wiki/Tag:boundary=exclave?uselang=en)\n- [Example](https://www.openstreetmap.org/relation/13193254)\n- [Explore tags in PMTiles](https://watmildon.github.io/TIGERMap/#map=12.44/51.43525/4.93301)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":51,"value":"overpassQuery = `[out:json][timeout:25];nwr[\"boundary\"=\"exclave\"](51.256758449834216,4.695244992849631,51.576642811561605,5.250054563162131);out geom;`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1239,"value":"overpassOsmJson = {\n const base = \"https://lz4.overpass-api.de/api/interpreter\";\n const url = `${base}?data=${encodeURIComponent(overpassQuery)}`;\n return await fetch(url).then((response) => response.json());\n}\n// FileAttachment(\"overpassOsm.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"overpassGeoJson = osmToGeoJson(overpassOsmJson)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"Cleaning up and sorting response:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":415,"value":"osmGeoJson = ({\n type: \"FeatureCollection\",\n features: overpassGeoJson.features\n // Filter to remove copy of enclave H17\n .filter((i) => i.properties.name)\n .map((i) => {\n const ref = i.properties.ref;\n const prefix = ref.slice(0, 1);\n const number = +ref.slice(1);\n // List Belgian enclaves first\n const base = prefix === \"H\" ? 0 : 100;\n // Add flag\n const flag = prefix === \"H\" ? \"🇧🇪\" : \"🇳🇱\";\n i.properties.sort = base + number;\n i.properties.flag = flag;\n return i;\n })\n .sort((a, b) => a.properties.sort - b.properties.sort)\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1038,"value":"Border markers in OSM:\n\n- [Grenspaal 214](https://www.openstreetmap.org/node/4345725512)\n- [Grenspaal 215](https://www.openstreetmap.org/node/10942871351)\n\nManually edited GeoJSON of the current border between NL and BE between marker 214 and 215:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1051,"value":"borderGeoJson = FileAttachment(\"border_osm@3.geojson\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"## Adding this to a Leaflet map","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":378,"value":"The following code modifies the `container` at the top to fill it with a Leaflet map using the Allmaps Leaflet plugin. See the ['Hello Leaflet' notebook](https://observablehq.com/@allmaps/leaflet-plugin) for a demo.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":240,"value":"map = {\n const map = L.map(container, {\n layers: [osmLayer, sheetLayer, enclaveGeoJsonLayer]\n // zoomSnap: 0,\n // wheelPxPerZoomLevel: 15\n });\n\n map.fitBounds(enclaveGeoJsonLayer.getBounds());\n\n // Adjust layer order after change in overlays\n // map.on(\"overlayadd\", function (e) {\n // osmLayer.bringToBack();\n // enclaveGeoJsonLayer.bringToFront();\n // });\n\n // map.once(\"moveend\", () => {\n // mutable zoom = map.getZoom();\n // mutable center = map.getCenter();\n // });\n\n invalidation.then(() => map.remove());\n\n return map;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":481,"value":"osmLayer = L.tileLayer(\"https://tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n attribution:\n '© OpenStreetMap contributors'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":384,"value":"Add GeoJSON with popups and fit map to bounds","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":243,"value":"enclaveGeoJsonLayer = L.geoJSON(osmGeoJson, {\n onEachFeature: (feature, layer) => {\n const props = feature.properties;\n const name = props.name;\n const flag = props.flag;\n layer.bindPopup(\n `

${flag} ${name}

`\n );\n },\n style: function (feature) {\n switch (feature.properties.flag) {\n case \"🇧🇪\":\n // Yellow: rgb(247,220,80)\n return { color: \"rgb(220,67,70)\" };\n case \"🇳🇱\":\n // Orange: rgb(239,140,52)\n return { color: \"rgb(38,67,135)\" };\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1021,"value":"borderGeoJsonLayer = L.geoJSON(borderGeoJson, {\n onEachFeature: (feature, layer) => {\n const props = feature.properties;\n const type = feature.geometry.type;\n const name =\n type === \"Point\"\n ? `Border marker ${props.name} (1843)`\n : `Current border ${props[\"name:en\"]}`;\n layer.bindPopup(\n `

${name}

`\n );\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":388,"value":"Add layer control","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":727,"value":"overlays = ({\n // Layers are added in this order!\n OpenStreetMap: osmLayer,\n \"Cadastral plans (georeferenced)\": sheetLayer,\n \"Cadastral plans (outlines)\": rceGeoJsonlayer,\n \"Cadastral overview\": overviewWarpedMapLayer,\n Enclaves: enclaveGeoJsonLayer,\n Border: borderGeoJsonLayer\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":277,"value":"layerControl = L.control.layers(null, overlays).addTo(map)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":780,"value":"Fly to enclave based on input","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":401,"value":"zoom = {\n if (selectedEnclave) {\n const layer = L.geoJson(selectedEnclave);\n const bounds = layer.getBounds();\n map.flyToBounds(bounds, { maxZoom: 18 });\n return bounds;\n } else return \"No enclave selected from input\";\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":735,"value":"## Functions and constants","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":799,"value":"allmapsViewerBase = \"https://viewer.allmaps.org/?url=\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":994,"value":"allmapsEditorBase = \"https://editor.allmaps.org/#/collection?url=\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"fetchJson = (url) => fetch(url).then((resp) => resp.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":257,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":228,"value":"## Imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":56,"value":"osmToGeoJson = require(\"osmtogeojson@3.0.0-beta.5/osmtogeojson.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"L = {\n const L = await require(\"leaflet@1/dist/leaflet.js\");\n if (!L._style) {\n const href = await require.resolve(\"leaflet@1/dist/leaflet.css\");\n document.head.appendChild(\n (L._style = html``)\n );\n }\n return L;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"allmapsLeaflet = require(\"@allmaps/leaflet@1.0.0-beta.40\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2d:"$2c:body"