30:T5bd,legendDesktop = svg` `31:T5b7,legendMobile = svg` `32:[{"id":"653e00a50297102d26773810b3549857ab3faee9a1a4a3dbc281c043adfb3f7095e8aed91e5ae3d51ff8b03f81a361a44a38f7fdd427aac42f2eb051b7c775f8","href":"https://static.observableusercontent.com/files/653e00a50297102d26773810b3549857ab3faee9a1a4a3dbc281c043adfb3f7095e8aed91e5ae3d51ff8b03f81a361a44a38f7fdd427aac42f2eb051b7c775f8","name":"log-chart-2020-03-23.csv","type":"text/csv","lastModified":1585061687001.952,"size":1104}] 2e:{"title":"Log-Chart","cells":[{"id":0,"value":"md`# Log-Chart`","pinned":true,"hidden":false,"mode":"ojs"},{"id":256,"value":"md`## Allgemeine Konfiguration`","pinned":false,"hidden":false,"mode":"ojs"},{"id":47,"value":"conf = {\n return {\n countries: [\n { label: \"Italien\", color: \"#7385ff\" },\n { label: \"Südkorea\", color: \"#7dd1c3\" },\n { label: \"USA\", color: \"#e0904f\" },\n { label: \"Deutschland\", color: \"#b6b6be\" },\n { label: \"Schweiz\", color: \"#c73530\" },\n { label: \"Japan\", color: \"#ac92d6\" },\n { label: \"Singapur\", color: \"#c5c294\" }\n ],\n labels: [100, 1000, 10000, 40000]\n };\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":245,"value":"md`## Mobile-width Grafik`","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"LogCasesMW = {\n const svgNode = svg`\n`;\n\n dayLabels(svgNode, mwConf);\n yLabels(svgNode, mwConf);\n conf.countries.forEach(c => lineForCountry(c, svgNode, mwConf));\n return svgNode;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"mwConf = {\n return {\n width: 380,\n height: 310,\n left: 55,\n bottom: 25\n };\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":252,"value":"md`## Content-width Grafik`","pinned":false,"hidden":false,"mode":"ojs"},{"id":228,"value":"LogCasesCW = {\n const svgNode = svg``;\n\n\n dayLabels(svgNode, cwConf);\n yLabels(svgNode, cwConf);\n conf.countries.forEach(c => lineForCountry(c, svgNode, cwConf));\n return svgNode;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":224,"value":"cwConf = {\n return {\n width: 637,\n height: 424,\n left: 55,\n bottom: 25\n };\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":53,"value":"function lineForCountry(c, svgNode, spec) {\n let countryData = data.filter(d => d[c.label]);\n\n d3.select(svgNode)\n .select(\"#lines\")\n .append(\"path\")\n .datum(countryData)\n .attr(\"fill\", \"none\")\n .attr(\"stroke\", c.color)\n .attr(\"stroke-width\", 2)\n .attr(\n \"d\",\n d3\n .line()\n .x(function(d) {\n return xScale(d.Tag, spec);\n })\n .y(function(d) {\n return yScale(d[c.label], spec);\n })\n );\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":136,"value":"function dayLabels(svgNode, spec) {\n let tage = data.filter(d => d.Tag % 5 == 0);\n tage.forEach(tag => {\n d3.select(svgNode)\n .select(\"#dayLabels\")\n .append(\"text\")\n .attr(\"x\", xScale(tag.Tag, spec) - 5)\n .attr(\"y\", spec.height)\n .style(\"font-family\", \"GT America\")\n .style(\"font-size\", 14)\n .text(tag.Tag);\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":201,"value":"function yLabels(svgNode, spec) {\n const format = d3.format(\",.2f\")\n conf.labels.forEach(label => {\n d3.select(svgNode)\n .select(\"#yLabels\")\n .append(\"line\")\n .attr(\"x1\", spec.left)\n .attr(\"x2\", spec.width)\n .attr(\"y1\", yScale(label, spec))\n .attr(\"y2\", yScale(label, spec))\n .attr(\"stroke\", \"#000000\")\n .attr(\"stroke-width\", 0.5);\n\n d3.select(svgNode)\n .select(\"#yLabels\")\n .append(\"text\")\n .attr(\"text-anchor\", \"end\")\n .attr(\"x\", 50)\n .attr(\"y\", yScale(label, spec) + 5)\n .style(\"font-family\", \"GT America\")\n .style(\"font-size\", 14)\n .text(format(label).split('.')[0].replace(',', ' '));\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":62,"value":"function yScale(value, spec) {\n if (value == null) {\n return null;\n }\n let scale = d3\n .scaleSymlog()\n .domain([min, max])\n .range([spec.height - spec.bottom, 0]);\n return scale(value);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":109,"value":"function xScale(value, spec) {\n let maxDay = d3.max(data.map(d => d.Tag));\n let scale = d3\n .scaleLinear()\n .domain([0, maxDay])\n .range([spec.left, spec.width]);\n\n return scale(value);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"data = {\n let d = d3.csvParse(await FileAttachment(\"log-chart-2020-03-23.csv\").text());\n d.map(day => {\n Object.keys(day).forEach(country => {\n if (day[country] == \"NA\") {\n day[country] = null;\n } else {\n day[country] = parseInt(day[country]);\n }\n });\n return day;\n });\n return d;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":63,"value":"max = d3.max(data.map(d => d3.max(Object.values(d))))","pinned":false,"hidden":false,"mode":"ojs"},{"id":157,"value":"min = d3.min(\n data.map(d => {\n return d3.min(\n Object.keys(d)\n .filter(k => k != \"Tag\")\n .map(k => d[k])\n );\n })\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":16,"value":"d3 = require(\"d3\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":279,"value":"legendStyles = svg`\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":274,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":271,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":344,"value":"getLabelXAxisAt = (y) => svg`\n\t\tTage seit dem Auftreten des 100. Falls\n\t`","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}