31:T144f,chart1 = { const ctx = DOM.context2d(w, h); // Background & Grid const x = w/2; const y1 = h/2 - 15; const y2 = h/2 + 15; gridLines(ctx, x, y1, y2); // top half halfGrid1(ctx, x, y1, "RGBA(239, 236, 230, .7)", "#a29374", "#a29374"); // "#efece6" // bottom half halfGrid2(ctx, x, y2, "RGBA(241, 229, 239, .7)", "#735a6f", "#735a6f"); // "#f1e5ef" // Viz ctx.lineWidth = 10; ctx.font = "bold 13px serif"; // Lines // Settlements & Infrastructure: <1% of forest loss ctx.beginPath(); ctx.strokeStyle = "#868e96"; ctx.moveTo(x - 1, y1 - 1); ctx.lineTo(x - 25, y1 - 21); ctx.stroke(); // Permanent Agriculture: 33% of forest loss ctx.beginPath(); ctx.strokeStyle = "#ebd185"; ctx.moveTo(x + 1, y2 + 1); ctx.lineTo(x - 180, y2 + 50); ctx.stroke(); // Wildfire: 29% of forest loss ctx.beginPath(); ctx.strokeStyle = "#e67700"; ctx.moveTo(x + 1, y2 + 1); ctx.lineTo(x - 75, y2 + 158); ctx.stroke(); // Logging: 25% of forest loss ctx.beginPath(); ctx.strokeStyle = "#935529"; ctx.moveTo(x - 1, y2 - 1); ctx.lineTo(x + 64, y2 + 135); ctx.stroke(); // Shifting Cultivation: 9,4% of forest loss ctx.beginPath(); ctx.strokeStyle = "#a9d863"; ctx.moveTo(x - 1, y2 - 1); ctx.lineTo(x + 54, y2 + 14); ctx.stroke(); // Other: 1,4% of forest loss ctx.beginPath(); ctx.strokeStyle = "#b48ead"; ctx.moveTo(x - 1, y1 + 1); ctx.lineTo(x + 45, y1 - 35); ctx.stroke(); // Hard Commodities: <1% of forest loss ctx.beginPath(); ctx.strokeStyle = "#8fbcbb"; ctx.moveTo(x, y1 + 1); ctx.lineTo(x, y1 - 30); ctx.stroke(); // Dots ctx.lineWidth = 1; // Settlements & Infrastructure: <1% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.arc(x - 26, y1 - 22, 5, 0, 2 * Math.PI); ctx.fillText("<1%", x - 60, y1 - 26); ctx.fill(); // Permanent Agriculture: 33% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.arc(x - 181, y2 + 51, 5, 0, 2 * Math.PI); ctx.fillText("33%", x - 182, y2 + 75); ctx.fill(); // Wildfire: 29% of forest loss ctx.beginPath(); ctx.arc(x - 76, y2 + 159, 5, 0, 2 * Math.PI), ctx.strokeStyle = "#868e96", ctx.stroke(), ctx.fillStyle = "#fff", ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#868e96", ctx.fillText("29%", x - 75, y2 + 180), ctx.fill(); // Logging: 25% of forest loss ctx.beginPath(); ctx.arc(x + 65, y2 + 136, 5, 0, 2 * Math.PI), ctx.strokeStyle = "#868e96", ctx.stroke(), ctx.fillStyle = "#fff", ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#868e96", ctx.fillText("25%", x + 70, y2 + 155); ctx.fill(); // Shifting Cultivation: 9,4% of forest loss ctx.beginPath(); ctx.arc(x + 55, y2 + 15, 5, 0, 2 * Math.PI), ctx.strokeStyle = "#868e96", ctx.stroke(), ctx.fillStyle = "#fff", ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#868e96", ctx.fillText("9,4%", x + 56, y2 + 35); ctx.fill(); // Other: 1,4% of forest loss ctx.beginPath(); ctx.arc(x + 46, y1 - 36, 5, 0, 2 * Math.PI), ctx.strokeStyle = "#868e96", ctx.stroke(), ctx.fillStyle = "#fff", ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#868e96", ctx.fillText("1,4%", x + 14, y1 - 42), ctx.fill(); // Hard Commodities: <1% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.arc(x, y1 - 28, 5, 0, 2 * Math.PI); ctx.fillText("<1%", x - 28, y1 - 38); ctx.fill(); // Legend const borderLeft = x/6; ctx.lineWidth = 10; ctx.font = "11px serif"; ctx.beginPath(); ctx.strokeStyle = "#868e96"; ctx.moveTo(borderLeft + 10, 10); ctx.lineTo(borderLeft + 35, 10); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#8fbcbb"; ctx.moveTo(borderLeft + 10, 30); ctx.lineTo(borderLeft + 35, 30); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#b48ead"; ctx.moveTo(borderLeft + 10, 50); ctx.lineTo(borderLeft + 35, 50); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#ebd185"; ctx.moveTo(borderLeft + 10, 70); ctx.lineTo(borderLeft + 35, 70); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#e67700"; ctx.moveTo(borderLeft + 10, 90); ctx.lineTo(borderLeft + 35, 90); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#935529"; ctx.moveTo(borderLeft + 10, 110); ctx.lineTo(borderLeft + 35, 110); ctx.stroke(); ctx.beginPath(); ctx.strokeStyle = "#a9d863"; ctx.moveTo(borderLeft + 10, 130); ctx.lineTo(borderLeft + 35, 130); ctx.stroke(); ctx.fillText("Settlements & Infrastructure", borderLeft + 40, 14); ctx.fillText("Hard Commodities", borderLeft + 40, 34); ctx.fillText("Other", borderLeft + 40, 54); ctx.fillText("Permanent Agriculture", borderLeft + 40, 74); ctx.fillText("Wildfire", borderLeft + 40, 94); ctx.fillText("Logging", borderLeft + 40, 114); ctx.fillText("Shifting Cultivation", borderLeft + 40, 134); ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#000"; ctx.arc(borderLeft + x/1.8, 10, 5, 0, 2 * Math.PI); ctx.fillText("Permanent Forest Loss", borderLeft + x/1.8 + 10, 14); ctx.fill(); ctx.beginPath(); ctx.lineWidth = 1; ctx.arc(borderLeft + x/1.8, 30, 5, 0, 2 * Math.PI), ctx.strokeStyle = "#868e96", ctx.stroke(), ctx.fillStyle = "#fff", ctx.fill(); ctx.beginPath(); ctx.fillStyle = "#000", ctx.fillText("Temporary Forest Loss", borderLeft + x/1.8 + 10, 34), ctx.fill(); return ctx.canvas; }32:Tc55,chart = { const ctx = DOM.context2d(w, h); // Background ctx.fillStyle = "#efece6"; ctx.fillRect(0, 0, w, h/2); ctx.fillStyle = "#f1e5ef"; ctx.fillRect(0, h/2, w, h/2); // Grid ctx.strokeStyle = "#c5cbd5"; // "#e5e9f0"; ctx.fillStyle = "#c5cbd5"; grid1(ctx, w/2, h/2); grid2(ctx, w/2, h/2); // Viz ctx.lineWidth = 10; ctx.font = "bold 13px serif"; // Lines // Settlements & Infrastructure: <1% of forest loss ctx.beginPath(); ctx.strokeStyle = "#868e96"; ctx.moveTo(w/2 - 1, h/2 - 1); ctx.lineTo(w/2 - 18, h/2 - 16); ctx.stroke(); // Permanent Agriculture: 33% of forest loss ctx.beginPath(); ctx.strokeStyle = "#ebd185"; ctx.moveTo(w/2 + 1, h/2 + 1); ctx.lineTo(w/2 - 90, h /2 + 30); ctx.stroke(); // Wildfire: 29% of forest loss ctx.beginPath(); ctx.strokeStyle = "#e67700"; ctx.moveTo(w/2 + 1, h/2 + 1); ctx.lineTo(w/2 - 36, h /2 + 80); ctx.stroke(); // Logging: 25% of forest loss ctx.beginPath(); ctx.strokeStyle = "#935529"; ctx.moveTo(w/2 - 1, h/2 - 1); ctx.lineTo(w/2 + 32, h /2 + 70); ctx.stroke(); // Shifting Cultivation: 9,4% of forest loss ctx.beginPath(); ctx.strokeStyle = "#a9d863"; ctx.moveTo(w/2 - 1, h/2 - 1); ctx.lineTo(w/2 + 24, h /2 + 7); ctx.stroke(); // Other: 1,4% of forest loss ctx.beginPath(); ctx.strokeStyle = "#b48ead"; ctx.moveTo(w/2 - 1, h/2 + 1); ctx.lineTo(w/2 + 32, h /2 - 28); ctx.stroke(); // Hard Commodities: <1% of forest loss ctx.beginPath(); ctx.strokeStyle = "#8fbcbb"; ctx.moveTo(w/2, h/2 + 1); ctx.lineTo(w/2, h /2 - 26); ctx.stroke(); // Dots // Settlements & Infrastructure: <1% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.moveTo(w/2 - 18, h/2 - 16); ctx.arc(w/2 - 17, h/2 - 15, 5, 0, 2 * Math.PI); ctx.fillText("<1%", w/2 - 40, h/2 - 25); ctx.fill(); // Permanent Agriculture: 33% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.moveTo(w/2 - 90, h /2 + 30); ctx.arc(w/2 - 90, h /2 + 30, 5, 0, 2 * Math.PI); ctx.fillText("33%", w/2 - 110, h /2 + 48); ctx.fill(); // Wildfire: 29% of forest loss ctx.beginPath(); ctx.fillStyle = "#fff"; ctx.moveTo(w/2 - 36, h /2 + 80); ctx.arc(w/2 - 35, h /2 + 78, 5, 0, 2 * Math.PI); ctx.fillText("29%", w/2 - 35, h /2 + 100); ctx.fill(); // Logging: 25% of forest loss ctx.beginPath(); ctx.fillStyle = "#fff"; ctx.moveTo(w/2 + 28, h /2 + 70); ctx.arc(w/2 + 32, h /2 + 70, 5, 0, 2 * Math.PI); ctx.fillText("25%", w/2 + 40, h /2 + 84); ctx.fill(); // Shifting Cultivation: 9,4% of forest loss ctx.beginPath(); ctx.fillStyle = "#fff"; ctx.moveTo(w/2 + 24, h /2 + 7); ctx.arc(w/2 + 22, h /2 + 6, 5, 0, 2 * Math.PI); ctx.fillText("9,4%", w/2 + 25, h /2 + 27); ctx.fill(); // Other: 1,4% of forest loss ctx.beginPath(); ctx.fillStyle = "#fff"; ctx.moveTo(w/2 + 32, h /2 - 28); ctx.arc(w/2 + 31, h /2 - 27, 5, 0, 2 * Math.PI); ctx.fillText("1,4%", w/2 + 14, h /2 - 40); ctx.fill(); // Hard Commodities: <1% of forest loss ctx.beginPath(); ctx.fillStyle = "#000"; ctx.moveTo(w/2, h /2 - 26); ctx.arc(w/2, h /2 - 24, 5, 0, 2 * Math.PI); ctx.fillText("<1%", w/2 - 18, h /2 - 38); ctx.fill(); return ctx.canvas; }33:[] 2f:{"title":"Causes of forest loss","cells":[{"id":0,"value":"# Causes of forest loss","pinned":false,"hidden":false,"mode":"md"},{"id":607,"value":"### The main drivers of forest loss worldwide 2001-2024","pinned":false,"hidden":false,"mode":"md"},{"id":5,"value":"Source: https://www.wri.org/insights/forest-loss-drivers-data-trends","pinned":false,"hidden":false,"mode":"md"},{"id":298,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":381,"value":"function gridLines (c, x, y1, y2) {\n c.strokeStyle = \"RGBA(170, 170, 170, .7)\";\n c.beginPath();\n // 3 lines at the top\n c.moveTo(x, y1); c.lineTo(w/4, h/4.2);\n c.moveTo(x, y1); c.lineTo(x, h/9);\n c.moveTo(x, y1); c.lineTo(x + w/4, h/4.2);\n // 4 lines at the bottom\n c.moveTo(x, y2); c.lineTo(w/9, h - h/3);\n c.moveTo(x, y2); c.lineTo(w/3, h - h/40);\n c.moveTo(x, y2); c.lineTo(w - w/3, h - h/40);\n c.moveTo(x, y2); c.lineTo(w - w/9, h - h/3);\n c.stroke();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":338,"value":"function halfGrid1 (c, x, y, f1, s1, f2) {\n c.beginPath();\n const r = 20;\n c.fillStyle = f1;\n c.arc(x, y, r * 10, 0, Math.PI, true); c.fill();\n c.strokeStyle = s1;\n c.fillStyle = f2;\n let n = 1;\n while (n < 6) {\n c.arc(x, y, r * 2 * n, 0, Math.PI, true);\n c.fillText(n + \"%\", x - r * 2 * n - 18, y + 13);\n n++;\n }\n c.stroke();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":311,"value":"function halfGrid2 (c, x, y, f1, s1, f2) {\n c.beginPath();\n const r = 30;\n c.fillStyle = f1;\n c.arc(x, y, r * 10, 0, Math.PI); c.fill();\n c.strokeStyle = s1;\n c.fillStyle = f2;\n let n = 1;\n while (n < 6) {\n c.arc(x, y, r * 2 * n, 0, Math.PI);\n c.fillText(n + \"0%\", x + r * 2 * n + 2, y - 3);\n n++;\n }\n c.stroke();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":545,"value":"___","pinned":false,"hidden":false,"mode":"md"},{"id":541,"value":"### First version:","pinned":false,"hidden":false,"mode":"md"},{"id":7,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"function grid1 (c, x, y) {\n const r = 30;\n let n = 1;\n c.beginPath();\n while (n < 11) {\n c.arc(x, y, r * n, 0, 2 * Math.PI);\n c.fillText(n + \"0%\", x + r * n + 2, y + 11);\n c.fillText(n + \"%\", x - r * n - 18, y - 2);\n n++;\n }\n c.stroke();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":39,"value":"function grid2 (c, x, y) {\n c.beginPath();\n // 3 lines at the top\n c.moveTo(x, y); c.lineTo(w/6, h/7);\n c.moveTo(x, y); c.lineTo(x, 0);\n c.moveTo(x, y); c.lineTo(x + w/3, h/7);\n // 4 lines at the bottom\n c.moveTo(x, y); c.lineTo(w/10, h - h/3);\n c.moveTo(x, y); c.lineTo(w/3, h - h/40);\n c.moveTo(x, y); c.lineTo(w - w/3, h - h/40);\n c.moveTo(x, y); c.lineTo(w - w/10, h - h/3);\n c.stroke();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":55,"value":"w = 900","pinned":false,"hidden":false,"mode":"ojs"},{"id":59,"value":"h = 700","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}