2b:null 2c:["$","title",null,{"children":"Océans à partir des pays | Atelier de cartographie de Sciences Po | Observable"}] 31:[{"id":"8f8c45dec4ac9c785ee049df608bb2b21b044062d79fb103b1ad11c7f105c90a9450a2b0e73fd3aa2d4122efdec6de758f00ae9938a0eb3d3816bab815f78cf2","href":"https://static.observableusercontent.com/files/8f8c45dec4ac9c785ee049df608bb2b21b044062d79fb103b1ad11c7f105c90a9450a2b0e73fd3aa2d4122efdec6de758f00ae9938a0eb3d3816bab815f78cf2","name":"countries_110m@1.json","type":"application/json","lastModified":1642521964835.171,"size":95306}] 2f:{"id":"97088b3d25f7068d","slug":"oceans-a-partir-des-pays","title":"Océans à partir des pays","thumbnail":"5f9a0aa4ab42f110ec36fbc2459b163a01db02fce6dd642f83d4c524063ff547","access_level":"public","create_time":"$D2022-01-04T20:57:51.794Z","update_time":"$D2022-05-25T10:15:51.559Z","view_time":null,"first_public_time":"$D2022-01-18T16:52:52.983Z","fork":false,"stars":3,"starred":false,"owner":{"type":"team","id":"5d76df5eab7f8bb7","login":"ateliercartographie","name":"Atelier de cartographie de Sciences Po","avatar_url":"https://avatars-next.observableusercontent.com/fab2304a50866da3a682fdbbdf200ecb01ddfd5fbf74f60756d36188cfd2cf68","tier":"starter_2024"},"version":798,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"b5f87f2a35829281","login":"tombor","name":"Thomas Ansart","avatar_url":"https://avatars-next.observableusercontent.com/b086dcc95470aae08b776435f7604190c606884a2187354d54b5fbae116aa241","tier":null}],"members":[{"type":"team","id":"5d76df5eab7f8bb7","login":"ateliercartographie","name":"Atelier de cartographie de Sciences Po","avatar_url":"https://avatars-next.observableusercontent.com/fab2304a50866da3a682fdbbdf200ecb01ddfd5fbf74f60756d36188cfd2cf68","tier":"starter_2024","role":"editor"},{"type":"individual","id":"b5f87f2a35829281","login":"tombor","name":"Thomas Ansart","avatar_url":"https://avatars-next.observableusercontent.com/b086dcc95470aae08b776435f7604190c606884a2187354d54b5fbae116aa241","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"ae5edacf60f09e75","slug":"graticule","title":"Graticule","owner":{"id":"5d76df5eab7f8bb7","login":"ateliercartographie","name":"Atelier de cartographie de Sciences Po"}},"type":"notebook","body":{"title":"Océans à partir des pays","cells":[{"id":0,"value":"# Océans à partir des pays\n## Générer une véritable couche des océans (sans les terres) à partir d'une couche des pays\n\n> Ce procédé est utilisé dans [**Graticule**](https://www.sciencespo.fr/cartographie/graticule/), un outil conçu et développé par l’Atelier de cartographie de Sciences Po. Gratuit et open source, il permet à tout type de public de s’initier à la cartographie et ses concepts par la réalisation de fond de carte.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":36,"value":"## D'une couche des pays (format topojson)...\n*importée depuis une version adaptée de NaturalEarth 110m v5.0.0*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":773,"value":"import {countries_simplified} from \"@tombor/adapter-natural-earth-les-pays\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"## ...en dériver une couche des continents...\n_à l'aide de topojson.merge. Le résultat est format geojson_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":27,"value":"land = topojson.merge(countries_simplified, countries_simplified.objects.countries_110m.geometries)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":656,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":58,"value":"## ...puis en dériver une couche des océans\n### Solution sans dépendance par @Fil 👍\nMerci pour sa contribution !","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":701,"value":"ocean = {\n const c = land.coordinates.slice().sort(([a], [b]) => b.length - a.length);\n return {\n type: \"MultiPolygon\",\n coordinates: [\n c.map(([outerRing]) => outerRing.slice().reverse()),\n c.flatMap(([, ...holes]) => holes.map((r) => r.slice().reverse()))\n ]\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":700,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":705,"value":"### Solution avec dépendance en plusieurs étapes\n#### Approche A 👎 \n*à l'aide de [turf.js](https://turfjs.org/docs/#rewind) et de sa fonction rewind* \nLes océans ne sont qu'une lecture inversée des continents => inverser l'ordre des coordonnées.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":63,"value":"oceanRewind = turf.rewind(land, {reverse: false}) // 👎 Ne fonctionne pas","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":435,"value":"#### Approche B 👎 \n*à l'aide de [polygon-clipping](https://github.com/mfogel/polygon-clipping) et de sa fonction difference* \nLes océans ne sont que la différence entre la sphere (le contour de la terre) et les continents. \n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":358,"value":"sphere = ({\n \"type\": \"Polygon\",\n \"coordinates\": [ [[-180, -90], [-180, 90], [180, 90], [180, -90], [-180, -90]] ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":361,"value":"// /!\\ return geojson RFC 7946 compatible\noceanDiff = ({\n \"type\": \"MultiPolygon\",\n \"coordinates\": clip.difference(sphere.coordinates, land.coordinates)\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":502,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":609,"value":"#### Approche C = B + A 👍 \nd3.js est compatible avec la précédente spécification de geojson (gj2008) et pas le RFC 7946. La principale différence entre les deux spécifications vient du *[winding order](https://macwright.com/2015/03/23/geojson-second-bite.html#winding)* (l'ordre des coordonnées). \nPour que la couche `oceanDiff` soit correctement affichée, il faut en inverser l'ordre des coordonnées. Et ainsi passer d'un geojson RFC 7946 compatible à gj2008 compatible.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":588,"value":"oceanDiffRewind = turf.rewind(oceanDiff, {reverse: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":592,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":537,"value":"---\n## Inspirations\n+ [Five Oceans](https://observablehq.com/@visionscarto/five-oceans-topojson) par [@Fil](https://observablehq.com/@fil)\n+ [Ocean](https://observablehq.com/@fil/ocean) par [@Fil](https://observablehq.com/@fil)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":30,"value":"---\n## Paramètres de la carte","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"projection = d3.geoEqualEarth().rotate([-150,0])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"path = d3.geoPath(projection)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":479,"value":"width = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"height = {\n const [[x0, y0], [x1, y1]] = d3.geoPath(projection.fitWidth(width, outline)).bounds(outline)\n const dy = Math.ceil(y1 - y0)\n return dy;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"outline = ({type: \"Sphere\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":746,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":696,"value":"---\n## Librairies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":56,"value":"turf = require(\"@turf/turf\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":350,"value":"clip = require(\"polygon-clipping@0.15.3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"