3e:null 3f:["$","title",null,{"children":"World map cartogram | Julia | Observable"}] 45:Te1d,cartogram = { //Get parameters const zoom = params.zoom, cols = params.cols, heightParam = params.heightParam, alpha = params.alpha, additionalTer = params.additionalTer, theme = getTheme(params.theme), displayGrid = params.displayGrid; const widthGraph = 127.6 * cols * zoom; const heightGraph = heightParam * zoom; const cartogram = d3 .create("svg") .attr("viewbox", [0, 0, widthGraph, heightGraph]) .attr("width", widthGraph) .attr("height", heightGraph); //Layers const meta = cartogram.append("g").attr("id", "meta"); const chart = cartogram.append("g").attr("id", "chart"); const grid = cartogram.append("g").attr("id", "grid"); const text = cartogram.append("g").attr("id", "text"); addBackground(meta, widthGraph, heightGraph, theme.bgColor); const unitWidth = Math.floor(widthGraph / 36); const unitHeight = Math.floor(heightGraph / 21); data.forEach((country) => { if (country.display === true) { chart .append("rect") .attr("id", country.iso3) .attr("x", country.posX * unitWidth) .attr("y", country.posY * unitHeight) .attr("width", unitWidth) .attr("height", unitHeight) .attr("fill", () => { switch (country.vote) { case "IN_FAVOUR": return theme.voteFavour; case "AGAINST": return theme.voteAgainst; case "ABSTENTION": return theme.voteAbst; case "ABSENT": return theme.voteAbsence; } }); text .append("text") .text(country[alpha]) .attr("x", country.posX * unitWidth + unitWidth / 2) .attr("y", country.posY * unitHeight + unitHeight / 2) .attr("fill", "white") .attr("alignment-baseline", "central") .attr("text-anchor", "middle") .style("font-family", "Source Code pro") .style("font-size", () => { if (alpha === "iso3") { return `${5 * zoom}px`; } else if (alpha === "iso2") { return `${6 * zoom}px`; } }) .style("font-weight", "Regular") .attr("fill", () => { switch (country.vote) { case "IN_FAVOUR": return theme.voteFavourText; case "AGAINST": return theme.voteAgainstText; case "ABSTENTION": return theme.voteAbstText; case "ABSENT": return theme.voteAbsenceText; } }); } }); if (additionalTer == "Yes") { additional.forEach((d) => { chart .append("rect") .attr("id", d.continent) .attr("x", d.posX * unitWidth) .attr("y", d.posY * unitHeight) .attr("width", unitWidth) .attr("height", unitHeight) .attr("fill", theme.additionnal); }); } if (displayGrid === "Yes") { for (let i = 0; i <= 36; i++) { grid .append("line") .attr("stroke", "currentColor") .attr("stroke-opacity", 1) .attr("stroke-width", 0.2 * zoom) .attr("x1", unitWidth * i) .attr("x2", unitWidth * i) .attr("y1", 0) .attr("y2", heightGraph); } for (let i = 0; i <= 21; i++) { grid .append("line") .attr("stroke", "currentColor") .attr("stroke-opacity", 1) .attr("stroke-width", 0.2 * zoom) .attr("x1", 0) .attr("x2", widthGraph) .attr("y1", unitHeight * i) .attr("y2", unitHeight * i); } } return cartogram.node(); }46:T502,themes = [ { name: "Google", bgColor: "#8AB4F7", additionnal: "#F5F0E4", voteFavour: "#008E45", voteAgainst: "#F83F22", voteAbst: "#A09388", voteAbsence: "#F1F1F1", voteFavourText: "#ffffff", voteAgainstText: "#ffffff", voteAbstText: "#ffffff", voteAbsenceText: "#C0C0C0" }, { name: "Cartogram V1", bgColor: "#FFFFFF", additionnal: "#ECEAE8", voteFavour: "#04B309", voteAgainst: "#EE0300", voteAbst: "#DFDFDF", voteAbsence: "#F7F7F7", voteFavourText: "#ffffff", voteAgainstText: "#ffffff", voteAbstText: "#000000", voteAbsenceText: "#cccccc" }, { name: "Version 2", bgColor: "#C6E4FC", additionnal: "#F5F0E4", voteFavour: "#1FA700", voteAgainst: "#F83F22", voteAbst: "#A09388", voteAbsence: "#92CADE", voteFavourText: "#ffffff", voteAgainstText: "#ffffff", voteAbstText: "#ffffff", voteAbsenceText: "#0294BE" }, { name: "Version 2 (no water)", bgColor: "#ffffff", additionnal: "#F5F0E4", voteFavour: "#1FA700", voteAgainst: "#F83F22", voteAbst: "#A09388", voteAbsence: "#F5F0E4", voteFavourText: "#ffffff", voteAgainstText: "#ffffff", voteAbstText: "#ffffff", voteAbsenceText: "#D7BA76" } ]47:[{"id":"da78bf20ad62a467a3f9df833e25d0f9388d9f75c09d6789cb0046f828c246407f054c2383013ef59bca98c83fbcbeb20ed1bd90e8c134c09403976b69caa5cc","href":"https://static.observableusercontent.com/files/da78bf20ad62a467a3f9df833e25d0f9388d9f75c09d6789cb0046f828c246407f054c2383013ef59bca98c83fbcbeb20ed1bd90e8c134c09403976b69caa5cc","name":"countries-1.geojson","type":"application/geo+json","lastModified":1702455867892.666,"size":3358554}] 43:{"id":"9498ab7636c9c9b6","slug":null,"title":"World map cartogram","thumbnail":"50559ea1ffbe8102e90541b956c7be423e693232eee805329531d8ffa3dea482","access_level":"public","create_time":"$D2023-12-13T08:24:27.892Z","update_time":"$D2023-12-13T08:24:27.892Z","view_time":null,"first_public_time":"$D2023-12-13T08:24:27.892Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"762a89307226ba56","login":"jhjanicki","name":"Julia","avatar_url":"https://avatars-next.observableusercontent.com/1a83505473ac33402b5145d95385e0d9f7717ede0640d042034e439c1734af41","tier":"starter_2024","bio":"Conservation biologist/ data viz developer / cartographer/ data storyteller","following":false},"version":469,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"cfc6864d79ba928a","login":"jhjanicki","name":"Julia","avatar_url":"https://avatars-next.observableusercontent.com/1a83505473ac33402b5145d95385e0d9f7717ede0640d042034e439c1734af41","tier":null,"bio":"Conservation biologist/ data viz developer / cartographer/ data storyteller","following":false}],"members":[{"type":"individual","id":"cfc6864d79ba928a","login":"jhjanicki","name":"Julia","avatar_url":"https://avatars-next.observableusercontent.com/1a83505473ac33402b5145d95385e0d9f7717ede0640d042034e439c1734af41","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"World map cartogram","cells":[{"id":0,"value":"# World map cartogram\n#### _Version 2_
\n_(En cours de validation)_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":399,"value":"📊 [Lien vers la spreadsheet](https://docs.google.com/spreadsheets/d/1rWYt3excMJ8FxN11jkovdMNLDycHqSTj2EF11OmKJEI/edit#gid=1840694866)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":11,"value":"_Parameters_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":69,"value":"viewof params = Inputs.form({\n zoom: Inputs.range([1, 3], { value: 2, step: 1, label: \"Zoom\" }),\n cols: Inputs.range([1, 5], { value: 3, label: \"Cols\", step: 1 }),\n heightParam: Inputs.range([0, 800], {\n label: \"Height\",\n value: 250,\n step: 1\n }),\n alpha: Inputs.radio([\"iso2\", \"iso3\"], { label: \"Alpha Code\", value: \"iso3\" }),\n theme: Inputs.radio([...themes.map((d) => d.name)], {\n label: \"Theme\",\n value: \"Version 2 (no water)\"\n }),\n additionalTer: Inputs.radio([\"Yes\", \"No\"], {\n label: \"Display territory ?\",\n value: \"Yes\"\n }),\n displayGrid: Inputs.radio([\"Yes\", \"No\"], {\n label: \"Display grid ?\",\n value: \"No\"\n })\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":414,"value":"Vote favour\nVote Against\nAbstention\nAbsent","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":265,"value":"_Data_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":274,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"data = d3.dsv(\n \";\",\n `https://docs.google.com/spreadsheets/d/1rWYt3excMJ8FxN11jkovdMNLDycHqSTj2EF11OmKJEI/gviz/tq?tqx=out:csv&sheet=minimal_data`,\n (d) => ({\n name: d.un_name_en,\n iso3: d.alpha3,\n iso2: d.alpha2,\n posX: +d.posX,\n posY: +d.posY,\n display: convertStringToBool(d.display),\n vote: d.vote\n })\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"additional = d3.dsv(\n \";\",\n `https://docs.google.com/spreadsheets/d/1rWYt3excMJ8FxN11jkovdMNLDycHqSTj2EF11OmKJEI/gviz/tq?tqx=out:csv&sheet=additional_data`,\n (d) => ({\n continent: d.continent,\n posX: +d.posX,\n posY: +d.posY\n })\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"countries = FileAttachment(\"countries-1.geojson\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"_Functions_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":296,"value":"getTheme = function (themeName) {\n const myTheme = themes.filter((d) => d.name === themeName);\n\n return myTheme[0];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":281,"value":"addBackground = function (group, widthDoc, heightDoc,color) {\n group\n .append(\"rect\")\n .attr(\"id\", \"whiteBg\")\n .attr(\"fill\", color)\n .attr(\"width\", widthDoc)\n .attr(\"height\", heightDoc)\n .style(\"opacity\", \"1\");\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"convertStringToBool = function (value) {\n if (value === \"TRUE\") {\n return true;\n } else if (value === \"FALSE\") {\n return false;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"_Librairies_","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":87,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W47","stdlib":"1"}} 44:"$43:body"