31:[{"id":"b7e9c45bf42f44ee36551f6301eb6d3f3c0b7a04e284dd1f76bb7d1d61ed632efbfccb474d093f76cf98d4dd8a320566a66a5ca6bd9980f9dd9e633c2f8627da","href":"https://static.observableusercontent.com/files/b7e9c45bf42f44ee36551f6301eb6d3f3c0b7a04e284dd1f76bb7d1d61ed632efbfccb474d093f76cf98d4dd8a320566a66a5ca6bd9980f9dd9e633c2f8627da","name":"Monatliche Temperaturen Schweiz.csv","type":"text/csv","lastModified":1647892939272.013,"size":17136},{"id":"2824d3d13a94eb7e86457f5e4abcc02a6606719f9dfcb1f872559d166fad2fa9d5d57d48add37289497bedc5acd06baff001d9e3c0bc70d9acb153e7abdaf54d","href":"https://static.observableusercontent.com/files/2824d3d13a94eb7e86457f5e4abcc02a6606719f9dfcb1f872559d166fad2fa9d5d57d48add37289497bedc5acd06baff001d9e3c0bc70d9acb153e7abdaf54d","name":"Monatliche Temperaturen Schweiz (nur Monate).csv","type":"text/csv","lastModified":1648070346563.962,"size":12040}] 2f:{"title":"Heatmap – Lösung","cells":[{"id":0,"value":"# Heatmap – Lösung\n\nAbweichung für zwölf Monate, vom Ganzjahresschnitt.","pinned":false,"hidden":false,"mode":"md"},{"id":156,"value":"\n

Temperaturen in der Schweiz

Abweichung vom langjährigen Schnitt

\n ${colorLegend}\n

\n \n

${tempPlot1}

Quelle: MeteoSchweiz

","pinned":true,"hidden":false,"mode":"html"},{"id":40,"value":"tempPlot1 = {\n // Äusserer Zeichnungsbereich\n const svg = d3\n .create(\"svg\")\n .attr(\"width\", width)\n .attr(\"height\", height)\n .attr(\"class\", \"chart\");\n\n // Innerer Zeichnungsbereich\n const g = svg\n .append(\"g\")\n .attr(\"transform\", `translate(${margin.left}, ${margin.top})`);\n\n // Achsen\n g.append(\"g\").attr(\"transform\", `translate(0, ${boundedHeight})`).call(xAxis);\n g.append(\"g\").attr(\"transform\", `translate(0, 0)`).call(yAxis);\n\n // Rechtecke hinzufügen (zeilenweise)\n months.forEach((month) => {\n g.append(\"g\")\n .selectAll(\"rect\")\n .data(data)\n .join(\"rect\")\n .attr(\"x\", (d) => x(d.time)) // horizontale Position: gemäss Jahr\n .attr(\"y\", y(month)) // vertikale Position: gemäss Monat\n .attr(\"width\", x.bandwidth)\n .attr(\"height\", y.bandwidth)\n .attr(\"fill\", (d) => color(d[month] - meanTemp)); // Farbe bestimmen\n });\n\n return svg.node();\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":184,"value":"##### Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":188,"value":"#### Canvas Parameters","pinned":false,"hidden":false,"mode":"md"},{"id":32,"value":"height = 300","pinned":true,"hidden":false,"mode":"ojs"},{"id":34,"value":"margin = ({\n top: 10,\n bottom: 25,\n left: 25,\n right: 25\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":36,"value":"boundedWidth = width - margin.left - margin.right","pinned":true,"hidden":false,"mode":"ojs"},{"id":38,"value":"boundedHeight = height - margin.top - margin.bottom","pinned":true,"hidden":false,"mode":"ojs"},{"id":192,"value":"#### Color scale and legend","pinned":false,"hidden":false,"mode":"md"},{"id":90,"value":"color = d3\n .scaleDiverging((t) => d3.interpolateRdBu(1 - t))\n .domain([-extent, 0, extent])","pinned":true,"hidden":false,"mode":"ojs"},{"id":131,"value":"colorLegend = Legend(color, { title: \"°C\" })","pinned":true,"hidden":false,"mode":"ojs"},{"id":128,"value":"import { Legend, Swatches } from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":198,"value":"#### Scales and axes","pinned":false,"hidden":false,"mode":"md"},{"id":67,"value":"x = d3\n .scaleBand()\n .domain(data.map((d) => d.time))\n .range([0, boundedWidth])\n .padding(0.05)","pinned":true,"hidden":false,"mode":"ojs"},{"id":57,"value":"y = d3.scaleBand().domain(months).range([0, boundedHeight]).padding(0.05)","pinned":true,"hidden":false,"mode":"ojs"},{"id":70,"value":"xAxis = d3\n .axisBottom(x)\n .tickValues(data.map((d) => d.time).filter((d) => d % 10 === 0))","pinned":true,"hidden":false,"mode":"ojs"},{"id":59,"value":"yAxis = d3.axisLeft(y)","pinned":true,"hidden":false,"mode":"ojs"},{"id":202,"value":"#### Data","pinned":false,"hidden":false,"mode":"md"},{"id":214,"value":"meanTemp = d3.mean(data.map((d) => d.year))","pinned":true,"hidden":false,"mode":"ojs"},{"id":245,"value":"extent = 15","pinned":true,"hidden":false,"mode":"ojs"},{"id":44,"value":"months = Object.keys(data[0]).slice(1, 13)","pinned":true,"hidden":false,"mode":"ojs"},{"id":28,"value":"Inputs.table(data)","pinned":true,"hidden":false,"mode":"ojs"},{"id":24,"value":"data = FileAttachment(\"Monatliche Temperaturen Schweiz (nur Monate).csv\").csv({\n typed: true\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":206,"value":"#### Style","pinned":false,"hidden":false,"mode":"md"},{"id":120,"value":"","pinned":true,"hidden":false,"mode":"html"},{"id":250,"value":"import { style } from \"@cas-datenvisualisierung/style\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":252,"value":"style","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}