2e:null 2f:["$","title",null,{"children":"Tägliche COVID-19 Fallzahlen im Kanton Zürich - stripDown | Office for Statistics and Data of the Canton of Zurich | Observable"}] 34:T1e72,viewof dayChart = { let yScale = yScaleF( scaleTyp, d3.extent(datenZH, (d) => d.n_conf / basis) ); let yTitle = ""; let kategorie = ""; if (basis == 1) { yTitle = "Anzahl Fälle"; kategorie = "(tägliche Fallzahlen)"; } else { yTitle = "Anzhl Fälle pro 100'000 Einwohner pro Tag"; kategorie = "(tägliche Fallzahlen/100'000 Einw.)"; } let line = d3 .line() .defined((d) => !isNaN(d.value)) .x((d) => xScale(d.date)) .y((d) => yScale(d.value / basis)); const svg = d3 .create("svg") .attr("viewBox", [0, 0, widthNow, height]) .attr("id", "STATchart1"); let yAxis = (g) => g.attr("transform", `translate(${widthNow - margin.right},0)`).call( d3 .axisLeft(yScale) .tickSize(widthNow - margin.left - margin.right) .tickFormat((d) => d.toLocaleString("de-CH")) ); const axisGr = svg.append("g"); const mouseGr = svg.append("g"); const chartGr = svg.append("g").attr("pointer-events", "none"); if (widthNow < 1020) { axisGr.select("#dayAxis").remove(); let xAxisMonth = axisGr.append("g").attr("id", "monthAxis").call(xAxisM); } else { axisGr.select("#monthAxis").remove(); let xAxisDay = axisGr.append("g").attr("id", "dayAxis").call(xAxis); } axisGr.append("g").call(yAxis); axisGr.selectAll(".tick").selectAll("line").style("stroke", "lightgrey"); axisGr.selectAll("path").style("stroke", "none"); let balkenWidth = (widthNow - margin.left - margin.right) / datenZH.length; const mouseRect = mouseGr .selectAll("rect.STATmouse") .data(datenZH) .enter() .append("rect") .attr("id", (d) => "m" + formatTime(d.date)) .attr("class", "STATmouse") .attr("cursor", "pointer") .attr("fill", "white") .attr("stroke-width", 0.5) .attr("stroke", "white") .attr("opacity", 0) .attr("x", (d, i) => xScale(d.date)) .attr("y", 0) .attr("width", balkenWidth) .attr("height", height); let balken = chartGr.selectAll("rect").data(datenZH); balken .enter() .append("rect") .attr("id", (d) => "a" + formatTime(d.date)) .attr("fill", "DarkGray") .attr("stroke-width", 0.5) .attr("stroke", "white") .attr("opacity", 1) .attr("x", (d, i) => xScale(d.date)) .attr("y", (d, i) => yScale(d.n_conf / basis)) .attr("width", balkenWidth) .attr("height", (d) => yScale(0) - yScale(d.n_conf / basis)); chartGr .append("g") .attr("transform", "translate(" + balkenWidth / 2 + "," + 0 + ")") .append("path") .datum(datenZHTagAvg) .attr("fill", "none") .attr("stroke-width", 3) .attr("stroke", "tomato") .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); axisGr .append("text") .attr("x", -margin.top - 10) .attr("y", 10) .text(yTitle) .style("fill", "dark gray") .attr("transform", "rotate(-90)") .style("text-anchor", "end"); addLine( "Ausserordentliche Lage: Lockdown", "2020-03-16", chartGr, yScale, xScale ); addLine("ZH: Maskenpflicht Läden", "2020-08-28", chartGr, yScale, xScale); addLine( "Ende der ausserordentlichen Lage", "2020-06-19", chartGr, yScale, xScale ); addLine("Home-Office empfohlen", "2020-10-19", chartGr, yScale, xScale); addLine("Maskenpflicht etc.", "2020-10-29", chartGr, yScale, xScale); addLine( "Sperrstunde 19.00; Sonntagsschliessung etc.", "2020-12-11", chartGr, yScale, xScale ); addLine( "Schliessung von Gastro, Freizeit-/Sportanlagen", "2020-12-22", chartGr, yScale, xScale ); addLine( "Schliessung von Läden, Home-Office-Pflicht", "2021-01-18", chartGr, yScale, xScale ); addLine("Öffnung von Läden, Museen", "2021-03-01", chartGr, yScale, xScale); addLine("Öffnung von Terrassen etc.", "2021-04-19", chartGr, yScale, xScale); addLine( "Eintritt Stabilisierungsphase", "2021-05-31", chartGr, yScale, xScale ); addLine( "Grossanlässe, Büro etc. erlaubt", "2021-06-26", chartGr, yScale, xScale ); addLine("Zertifikatspflicht", "2021-09-13", chartGr, yScale, xScale); addLine( "erweiterte Zertifikats-/Maskenpflicht", "2021-12-06", chartGr, yScale, xScale ); addLine( "2G, 2G+, Home-Office-Pflicht", "2021-12-20", chartGr, yScale, xScale ); addLine( "Aufhebung Home-Office-Pflicht & Kontaktquarantäne", "2022-02-03", chartGr, yScale, xScale ); addLine( "Aufhebung (fast) aller Massnahmen", "2022-02-17", chartGr, yScale, xScale ); addLine("Ende der Massnahmen", "2022-04-01", chartGr, yScale, xScale); let tag, tageswert, mittelwert, week; mouseGr.selectAll("rect").on("mouseover", function (d) { let da = d3.select(this).data()[0]; tageswert = da; tag = d3 .timeParse("%Q")(+da.date) .toLocaleString("de-CH", { day: "numeric", month: "long" }); mittelwert = bisect(datenZHTagAvg, d3.timeParse("%Q")(+da.date)); week = d3.timeFormat("%U")(d3.timeParse("%Q")(+da.date)); chartGr.selectAll("rect").attr("fill", "DarkGray"); chartGr.select("#a" + formatTime(+da.date)).attr("fill", "dimgrey"); chartGr.select("#thisMouse").remove(); let thisMouse = chartGr.append("g").attr("id", "thisMouse"); let translateX = d3.min([ widthNow - margin.right - margin.left - 20, d3.max([xScale(da.date) - 40, 0]) ]); let translateY = d3.min([height - 60, yScale(mittelwert.value / basis)]) - 60; let thisGr = thisMouse .append("g") .attr("transform", "translate(" + translateX + "," + translateY + ")"); thisGr .append("rect") .attr("x", 0) .attr("y", 0) .attr("width", 80) .attr("height", 45) .style("fill", "white") .style("opacity", 0.6); thisGr .append("text") .attr("dx", 40) .attr("dy", "1em") .style("text-anchor", "middle") .text(tag); let text1 = ""; if (mittelwert.value >= 0) { text1 = Math.round((mittelwert.value / basis) * 10) / 10; } console.log(mittelwert); thisGr .append("text") .attr("dx", 30) .attr("dy", "2.2em") .style("text-anchor", "end") .style("fill", "tomato") .text(text1); thisGr .append("text") .attr("dx", 72) .attr("dy", "2.2em") .style("text-anchor", "end") .style("fill", "grey") .text("(" + Math.round((tageswert.n_conf / basis) * 10) / 10 + ")"); }); let element2 = svg .append("g") .attr("transform", "translate(" + margin.left + ",410)"); element2 .append("line") .attr("x1", 0) .attr("x2", 15) .attr("y1", 8) .attr("y2", 8) .style("stroke", "tomato") .style("stroke-width", 3); element2 .append("text") .attr("x", 20) .attr("y", 13) .text("gleitendes Mittel (7 Tage)"); let element1 = svg .append("g") .attr("transform", "translate(" + margin.left + ",435)"); element1 .append("rect") .attr("x", 0) .attr("y", 0) .attr("height", 15) .attr("width", 15) .style("fill", "grey"); element1.append("text").attr("x", 20).attr("y", 13).text(kategorie); svg.selectAll("text").attr("font-size", "calc(0vw + 12px)"); axisGr.selectAll("text").attr("font-size", "calc(0vw + 14px)"); return Object.assign(svg.node(), { value: null, onmousemove: (event) => { event.currentTarget.value = { tag: tag, mittel: mittelwert.value / basis, neu: tageswert.n_conf, woche: week }; event.currentTarget.dispatchEvent(new CustomEvent("input")); } }); }35:T1e3e,dayChartDeath = { let yScale = yScaleF( scaleTyp, d3.extent(datenZH, (d) => d.n_deceased) ); let yAxis = (g) => g .attr("transform", `translate(${widthNow - margin.right},0)`) .call( d3.axisLeft(yScale).tickSize(widthNow - margin.left - margin.right) ); let line = d3 .line() .defined((d) => d.value >= 0) //.defined(d => !isNaN(d.value)) .x((d) => xScale(d.date)) .y((d) => yScale(d.value)); const svg = d3 .create("svg") .attr("viewBox", [0, 0, widthNow, height]) .attr("id", "STATchart1"); const axisGr = svg.append("g"); const mouseGr = svg.append("g"); const chartGr = svg.append("g").attr("pointer-events", "none"); if (widthNow < 1020) { axisGr.select("#dayAxis").remove(); let xAxisMonth = axisGr.append("g").attr("id", "monthAxis").call(xAxisM); } else { axisGr.select("#monthAxis").remove(); let xAxisMonth = axisGr.append("g").attr("id", "dayAxis").call(xAxis); } axisGr.append("g").call(yAxis); let balkenWidth = (widthNow - margin.left - margin.right) / datenZH.length; axisGr.selectAll(".tick").selectAll("line").style("stroke", "lightgrey"); axisGr.selectAll("path").style("stroke", "none"); const mouseRect = mouseGr .selectAll("rect.STATmouse") .data(datenZH) .enter() .append("rect") .attr("id", (d) => "m" + formatTime(d.date)) .attr("class", "STATmouse") .attr("cursor", "pointer") .attr("fill", "white") .attr("stroke-width", 0.5) .attr("stroke", "white") .attr("opacity", 0) .attr("x", (d, i) => xScale(d.date)) .attr("y", 0) .attr("width", balkenWidth) .attr("height", height); let balken = chartGr.selectAll("rect").data(datenZH); balken .enter() .append("rect") .attr("id", (d) => "a" + formatTime(d.date)) .attr("fill", "grey") .attr("stroke-width", 0.5) .attr("stroke", "white") .attr("opacity", 0.7) .attr("x", (d, i) => xScale(d.date)) .attr("y", (d, i) => yScale(d.n_deceased)) .attr("width", balkenWidth) .attr("height", (d) => yScale(0) - yScale(d.n_deceased)); chartGr .append("g") .attr("transform", "translate(" + balkenWidth / 2 + "," + 0 + ")") .append("path") .datum(datenZHTagAvgDeceased) .attr("fill", "none") .attr("stroke-width", 3) .attr("stroke", "tomato") .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); let tag, tageswert, mittelwert, week; axisGr .append("text") .attr("x", -margin.top) .attr("y", 10) .text("Anzahl Fälle") .style("fill", "dark gray") .attr("transform", "rotate(-90)") .style("text-anchor", "end"); addLine( "Ausserordentliche Lage: Lockdown", "2020-03-16", chartGr, yScale, xScale ); addLine("ZH: Maskenpflicht Läden", "2020-08-28", chartGr, yScale, xScale); addLine( "Ende der ausserordentlichen Lage", "2020-06-19", chartGr, yScale, xScale ); addLine("Home-Office empfohlen", "2020-10-19", chartGr, yScale, xScale); addLine("Maskenpflicht etc.", "2020-10-29", chartGr, yScale, xScale); addLine( "Sperrstunde 19.00; Sonntagsschliessung etc.", "2020-12-11", chartGr, yScale, xScale ); addLine( "Schliessung von Gastro, Freizeit-/Sportanlagen", "2020-12-22", chartGr, yScale, xScale ); addLine( "Schliessung von Läden, Home-Office-Pflicht", "2021-01-18", chartGr, yScale, xScale ); addLine("Öffnung von Läden, Museen", "2021-03-01", chartGr, yScale, xScale); addLine("Öffnung von Terrassen etc.", "2021-04-19", chartGr, yScale, xScale); addLine( "Eintritt Stabilisierungsphase", "2021-05-31", chartGr, yScale, xScale ); addLine( "Grossanlässe, Büro etc. erlaubt", "2021-06-26", chartGr, yScale, xScale ); addLine("Zertifikatspflicht", "2021-09-13", chartGr, yScale, xScale); addLine( "erweiterte Zertifikats-/Maskenpflicht", "2021-12-06", chartGr, yScale, xScale ); addLine( "2G, 2G+, Home-Office-Pflicht", "2021-12-20", chartGr, yScale, xScale ); addLine( "Aufhebung Home-Office-Pflicht & Kontaktquarantäne", "2022-02-03", chartGr, yScale, xScale ); addLine( "Aufhebung (fast) aller Massnahmen", "2022-02-17", chartGr, yScale, xScale ); addLine("Ende der Massnahmen", "2022-04-01", chartGr, yScale, xScale); mouseGr.selectAll("rect").on("mouseover", function (d) { let da = d3.select(this).data()[0]; tageswert = da; tag = d3 .timeParse("%Q")(+da.date) .toLocaleString("de-CH", { day: "numeric", month: "long" }); mittelwert = bisect(datenZHTagAvgDeceased, d3.timeParse("%Q")(+da.date)); week = d3.timeFormat("%U")(d3.timeParse("%Q")(+da.date)); chartGr.selectAll("rect").attr("opacity", 0.7); chartGr.select("#a" + formatTime(+da.date)).attr("opacity", 1); chartGr.select("#thisMouse").remove(); let thisMouse = chartGr.append("g").attr("id", "thisMouse"); let translateX = d3.min([ widthNow - margin.right - margin.left - 20, d3.max([xScale(da.date) - 40, 0]) ]); let translateY = d3.min([height - 60, yScale(mittelwert.value)]) - 60; let thisGr = thisMouse .append("g") .attr("transform", "translate(" + translateX + "," + translateY + ")"); thisGr .append("rect") .attr("x", 0) .attr("y", 0) .attr("width", 80) .attr("height", 45) .style("fill", "white") .style("opacity", 0.6); thisGr .append("text") .attr("dx", 40) .attr("dy", "1em") .style("text-anchor", "middle") .text(tag); let text1 = ""; if (mittelwert.value >= 0) { text1 = Math.round(mittelwert.value * 10) / 10; } thisGr .append("text") .attr("dx", 30) .attr("dy", "2.2em") .style("text-anchor", "end") .style("fill", "tomato") .text(text1); thisGr .append("text") .attr("dx", 72) .attr("dy", "2.2em") .style("text-anchor", "end") .style("fill", "grey"); thisGr .append("text") .attr("dx", 72) .attr("dy", "2.2em") .style("text-anchor", "end") .style("fill", "grey") .text(function (d) { if (tageswert.n_deceased >= 0) { return "(" + Math.round(tageswert.n_deceased) + ")"; } else { return null; } }); }); let element2 = svg .append("g") .attr("transform", "translate(" + margin.left + ",435)"); element2 .append("line") .attr("x1", 0) .attr("x2", 15) .attr("y1", 8) .attr("y2", 8) .style("stroke", "tomato") .style("stroke-width", 3); element2 .append("text") .attr("x", 20) .attr("y", 13) .text("gleitendes Mittel (7 Tage)"); let element1 = svg .append("g") .attr("transform", "translate(" + margin.left + ",460)"); element1 .append("rect") .attr("x", 0) .attr("y", 0) .attr("height", 15) .attr("width", 15) .style("fill", "grey"); element1 .append("text") .attr("x", 20) .attr("y", 13) .text("(tägliche Todesfälle)"); svg.selectAll("text").attr("font-size", "calc(0vw + 12px)"); axisGr.selectAll("text").attr("font-size", "calc(0vw + 14px)"); return Object.assign(svg.node(), { value: null, onmousemove: (event) => { event.currentTarget.value = { tag: tag, mittel: mittelwert.value, neu: tageswert.n_deceased, woche: week }; event.currentTarget.dispatchEvent(new CustomEvent("input")); } }); }36:T1f68,dayChartHosp = { let yScale = yScaleF( scaleTyp, d3.extent(datenZH, (d) => +d.current_hosp) ); let yAxis = (g) => g .attr("transform", `translate(${widthNow - margin.right},0)`) .call( d3.axisLeft(yScale).tickSize(widthNow - margin.left - margin.right) ); let line1 = d3 .line() .defined((d) => !isNaN(d.current_hosp)) .x((d) => xScale(d.date)) .y((d) => yScale(d.current_hosp)); let line2 = d3 .line() .defined((d) => !isNaN(d.current_vent)) .x((d) => xScale(d.date)) .y((d) => yScale(d.current_vent)); let line3 = d3 .line() .defined((d) => !isNaN(d.current_vent)) .x((d) => xScale(d.date)) .y((d) => yScale(d.current_icu)); const svg = d3 .create("svg") .attr("viewBox", [0, 0, widthNow, height]) .attr("id", "STATchart1"); const axisGr = svg.append("g"); const mouseGr = svg.append("g"); const chartGr = svg.append("g").attr("pointer-events", "none"); if (widthNow < 1120) { axisGr.select("#dayAxis").remove(); let xAxisMonth = axisGr.append("g").attr("id", "monthAxis").call(xAxisM); } else { axisGr.select("#monthAxis").remove(); axisGr.append("g").attr("id", "dayAxis").call(xAxis); } axisGr.append("g").call(yAxis); let balkenWidth = (widthNow - margin.left - margin.right) / datenZH.length; axisGr.selectAll(".tick").selectAll("line").style("stroke", "lightgrey"); axisGr.selectAll("path").style("stroke", "none"); const mouseRect = mouseGr .selectAll("rect.STATmouse") .data(datenZH) .enter() .append("rect") .attr("id", (d) => "m" + formatTime(d.date)) .attr("class", "STATmouse") .attr("cursor", "pointer") .attr("fill", "white") .attr("stroke-width", 0.5) .attr("stroke", "white") .attr("opacity", 0) .attr("x", (d, i) => xScale(d.date)) .attr("y", 0) .attr("width", balkenWidth) .attr("height", height); chartGr .append("g") .attr("transform", "translate(" + balkenWidth / 2 + "," + 0 + ")") .append("path") .datum(datenZH) .attr("fill", "none") .attr("stroke-width", 3) .attr("stroke", "steelblue") .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line1); chartGr .append("g") .attr("transform", "translate(" + balkenWidth / 2 + "," + 0 + ")") .append("path") .datum(datenZH) .attr("fill", "none") .attr("stroke-width", 3) .attr("stroke", "SkyBlue") .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line2); chartGr .append("g") .attr("transform", "translate(" + balkenWidth / 2 + "," + 0 + ")") .append("path") .datum(datenZH) .attr("fill", "none") .attr("stroke-width", 3) .attr("stroke", "#2D5373") .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line3); let tag, tageswert, hosp, vent, week, icu; addLine( "Ausserordentliche Lage: Lockdown", "2020-03-16", chartGr, yScale, xScale ); addLine("ZH: Maskenpflicht Läden", "2020-08-28", chartGr, yScale, xScale); addLine( "Ende der ausserordentlichen Lage", "2020-06-19", chartGr, yScale, xScale ); addLine("Home-Office empfohlen", "2020-10-19", chartGr, yScale, xScale); addLine("Maskenpflicht etc.", "2020-10-29", chartGr, yScale, xScale); addLine( "Sperrstunde 19.00; Sonntagsschliessung etc.", "2020-12-11", chartGr, yScale, xScale ); addLine( "Schliessung von Gastro, Freizeit-/Sportanlagen", "2020-12-22", chartGr, yScale, xScale ); addLine( "Schliessung von Läden, Home-Office-Pflicht", "2021-01-18", chartGr, yScale, xScale ); addLine("Öffnung von Läden, Museen", "2021-03-01", chartGr, yScale, xScale); addLine("Öffnung von Terrassen etc.", "2021-04-19", chartGr, yScale, xScale); addLine( "Eintritt Stabilisierungsphase", "2021-05-31", chartGr, yScale, xScale ); addLine( "Grossanlässe, Büro etc. erlaubt", "2021-06-26", chartGr, yScale, xScale ); addLine("Zertifikatspflicht", "2021-09-13", chartGr, yScale, xScale); addLine( "erweiterte Zertifikats-/Maskenpflicht", "2021-12-06", chartGr, yScale, xScale ); addLine( "2G, 2G+, Home-Office-Pflicht", "2021-12-20", chartGr, yScale, xScale ); addLine( "Aufhebung Home-Office-Pflicht & Kontaktquarantäne", "2022-02-03", chartGr, yScale, xScale ); addLine( "Aufhebung (fast) aller Massnahmen", "2022-02-17", chartGr, yScale, xScale ); addLine("Ende der Massnahmen", "2022-04-01", chartGr, yScale, xScale); mouseGr.selectAll("rect").on("mouseover", function (d) { let da = d3.select(this).data()[0]; tageswert = da; tag = d3 .timeParse("%Q")(+da.date) .toLocaleString("de-CH", { day: "numeric", month: "long" }); hosp = tageswert.current_hosp; vent = tageswert.current_vent; icu = tageswert.current_icu; week = d3.timeFormat("%U")(d3.timeParse("%Q")(+da.date)); chartGr.selectAll("rect").attr("opacity", 0.7); chartGr.select("#a" + formatTime(+da.date)).attr("opacity", 1); chartGr.select("#thisMouse").remove(); let thisMouse = chartGr.append("g").attr("id", "thisMouse"); let translateX = d3.min([ widthNow - margin.right - margin.left - 20, d3.max([xScale(da.date) - 40, 0]) ]); let translateY = d3.max([50, yScale(tageswert.current_hosp)]) - 50; let thisGr = thisMouse .append("g") .attr("transform", "translate(" + translateX + "," + translateY + ")"); thisGr .append("rect") .attr("x", 0) .attr("y", 0) .attr("width", 80) .attr("height", 45) .style("fill", "white") .style("opacity", 0.6); thisGr .append("text") .attr("dx", 40) .attr("dy", "1em") .style("text-anchor", "middle") .text(tag); let text1 = ""; let text2 = ""; let text3 = ""; if (hosp >= 0) { text1 = Math.round(hosp); } if (vent >= 0) { text2 = Math.round(vent); } if (icu >= 0) { text3 = Math.round(icu); } thisGr .append("text") .attr("dx", 40) .attr("dy", "2.2em") .style("text-anchor", "middle") .style("fill", "steelblue") .text(text1 + " / " + text3 + " / " + text2); }); let element2 = svg .append("g") .attr("transform", "translate(" + margin.left + ",400)"); element2 .append("line") .attr("x1", 0) .attr("x2", 15) .attr("y1", 8) .attr("y2", 8) .style("stroke", "steelblue") .style("stroke-width", 3); element2.append("text").attr("x", 20).attr("y", 13).text("Hospitalisierte"); let element1 = svg .append("g") .attr("transform", "translate(" + margin.left + ",420)"); element1 .append("line") .attr("x1", 0) .attr("x2", 15) .attr("y1", 8) .attr("y2", 8) .style("stroke", "SkyBlue") .style("stroke-width", 3); element1.append("text").attr("x", 20).attr("y", 13).text("davon Beatmete"); let element3 = svg .append("g") .attr("transform", "translate(" + margin.left + ",440)"); element3 .append("line") .attr("x1", 0) .attr("x2", 15) .attr("y1", 8) .attr("y2", 8) .style("stroke", "#2D5373") .style("stroke-width", 3); element3 .append("text") .attr("x", 20) .attr("y", 13) .text("davon in Intensivpflege"); svg.selectAll("text").attr("font-size", "calc(0vw + 12px)"); axisGr.selectAll("text").attr("font-size", "calc(0vw + 14px)"); return Object.assign(svg.node(), { value: null, onmousemove: (event) => { event.currentTarget.value = { tag: tag, mittel: tageswert.current_hosp, neu: tageswert.n_deceased, woche: week }; event.currentTarget.dispatchEvent(new CustomEvent("input")); } }); }37:T6d1,datenZH = d3 .csv( "https://raw.githubusercontent.com/openZH/covid_19/master/fallzahlen_kanton_total_csv_v2/COVID19_Fallzahlen_Kanton_ZH_total.csv" ) .then(function(data) { let oldConf = 0; let oldDeceased = 0; data.forEach(function(d) { d.date = parseTime(d.date); d.ncumul_tested.length > 0 ? (d.ncumul_tested = +d.ncumul_tested) : (d.ncumul_tested = undefined); d.ncumul_conf.length > 0 ? (d.ncumul_conf = +d.ncumul_conf) : (d.ncumul_conf = undefined); d.n_conf = d.ncumul_conf - oldConf; d.n_deceased = d.ncumul_deceased - oldDeceased; d.new_hosp.length > 0 ? (d.new_hosp = +d.new_hosp) : (d.new_hosp = undefined); d.current_hosp.length > 0 ? (d.current_hosp = +d.current_hosp) : (d.current_hosp = undefined); d.current_icu.length > 0 ? (d.current_icu = +d.current_icu) : (d.current_icu = undefined); d.current_vent.length > 0 ? (d.current_vent = +d.current_vent) : (d.current_vent = undefined); d.ncumul_released.length > 0 ? (d.ncumul_released = +d.ncumul_released) : (d.ncumul_released = undefined); d.ncumul_deceased.length > 0 ? (d.ncumul_deceased = +d.ncumul_deceased) : (d.ncumul_deceased = 0); d.current_isolated.length > 0 ? (d.current_isolated = +d.current_isolated) : (d.current_isolated = undefined); d.current_quarantined.length > 0 ? (d.current_quarantined = +d.current_quarantined) : (d.current_quarantined = undefined); oldConf = d.ncumul_conf; oldDeceased = +d.ncumul_deceased; }); return data.filter(el => el.date >= parseTime(zeitraum)); })38:[] 32:{"id":"0737f3a51ca29bdf","slug":"tagliche-covid-19-fallzahlen-im-kanton-zurich-stripdown","title":"Tägliche COVID-19 Fallzahlen im Kanton Zürich - stripDown","thumbnail":"f69df6077c0bedbd3c5d095664598ad77a2651ceb347b8dfe52835f4f6a96392","access_level":"public","create_time":"$D2020-08-28T06:47:37.856Z","update_time":"$D2022-04-07T08:30:47.997Z","view_time":null,"first_public_time":"$D2020-08-28T06:48:05.283Z","has_unpublished_edits":null,"fork":{"id":"24572a124135edc3","slug":"tagliche-covid-19-fallzahlen-im-kanton-zurich-mit-tabellar","title":"Tägliche COVID-19 Fallzahlen im Kanton Zürich - mit tabellarischer Darstellung","owner":{"id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich"}},"stars":1,"starred":false,"owner":{"type":"team","id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich","avatar_url":"https://avatars-next.observableusercontent.com/61364635cd5db7a914727e7625ac41daa90fedeba239e3d2ce93b57a9ad3bce9","tier":"pro"},"version":3293,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"37f1612f224a0555","login":"mmznrstat","name":"Matthias Mazenauer","avatar_url":"https://avatars-next.observableusercontent.com/ef3d946ccf160cca48b7f42bef702f21fe993881f97ef1654f4d43be2e36569d","tier":null}],"members":[{"type":"individual","id":"37f1612f224a0555","login":"mmznrstat","name":"Matthias Mazenauer","avatar_url":"https://avatars-next.observableusercontent.com/ef3d946ccf160cca48b7f42bef702f21fe993881f97ef1654f4d43be2e36569d","tier":null,"role":"editor"},{"type":"team","id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich","avatar_url":"https://avatars-next.observableusercontent.com/61364635cd5db7a914727e7625ac41daa90fedeba239e3d2ce93b57a9ad3bce9","tier":"pro","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"81f9fa676fc4c7d1","slug":"covid19","title":"covid19","owner":{"id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich"}},"type":"notebook","body":{"title":"Tägliche COVID-19 Fallzahlen im Kanton Zürich - stripDown","cells":[{"id":4,"value":"md`\n# Tägliche COVID-19 Fallzahlen im Kanton Zürich - stripDown\n### [Fach- und Koordinationsstelle OGD](https://open.zh.ch/content/internet/justiz_inneres/ogd/de/home.html)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1531,"value":"md`## Positiv Getestete`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3066,"value":"viewof zeitraum = radio({\n title: \"Bitte wählen Sie den gewünschten Zeitraum\",\n description: \"\",\n options: [\n { label: \"Gesamter Zeitraum\", value: \"2020-01-01\" },\n { label: \"Ab Juni 2020 (Ende erste Welle)\", value: \"2020-05-25\" },\n {\n label: \"Ab Juni 2021 (Eintritt Stabilisierungsphase)\",\n value: \"2021-05-25\"\n }\n ],\n value: \"2020-05-25\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3104,"value":"viewof basisInt = radio({\n title: '',\n description: '',\n options: [\n { label: \"Inzidenz pro 100'000 Einwohner pro Tag\", value: (populationZH/100000) },\n { label: 'Anzahl Fälle', value: '1' },\n ],\n value: '1'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3134,"value":"basis = 1","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3123,"value":"addLine = function(text,date,container, yScale,xScale) {\n container\n .append('text')\n .attr('y', '-.2em')\n .attr('x', -4)\n .attr('font-size', '12px')\n .attr('text-anchor', 'end')\n .attr(\"fill\", \"darkorange\")\n .text(text)\n .attr(\n 'transform',\n 'translate(' +\n xScale(parseTime(date)) +\n ',' +\n margin.top +\n ')rotate(-90)'\n )\n .style('font-family', 'Helvetica, Arial, sans-serif');\n \n container\n .append('line')\n .attr('x1', xScale(parseTime(date)))\n .attr('x2', xScale(parseTime(date)))\n .attr('y1', yScale.range()[0])\n .attr('y2', yScale.range()[1])\n .attr(\"stroke\", \"darkorange\")\n .attr(\"stroke-width\", 1.5)\n .attr(\"stroke-linejoin\", \"round\")\n .attr(\"stroke-linecap\", \"round\");\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2012,"value":"html`

${\n dayChart\n ? `Am ${dayChart.tag} wurden ${\n dayChart.neu\n } Neuansteckungen gemeldet. Der Mittelwert der Neuansteckungen über sieben Tage beträgt ${Math.round(\n dayChart.mittel\n )}.`\n : `Bitte fahren Sie mit der Maus über das Diagramm.`\n}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1534,"value":"md`## Todesfälle`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2834,"value":"viewof scaleTyp = DOM.select([\"linear\", \"log\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1538,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1593,"value":"md`## Hospitalisierte / Beatmete`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1591,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"md`## Daten`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"html` $\"\"$ `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":338,"value":"value = \"ncumul_conf\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2388,"value":"widthNow = d3.min([768, width]);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3202,"value":"zeitmarker = d3.csv(\n \"https://raw.githubusercontent.com/statistikZH/covid19zeitmarker/master/covid19zeitmarker.csv\"\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":623,"value":"datenZHTagAvg = movingAverage(datenZH.map(d => [d.n_conf, d.date]), 7)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1544,"value":"datenZHTagAvgDeceased = movingAverage(\n datenZH.map(d => [d.n_deceased, d.date]),\n 7\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2500,"value":"Last7DayCases = datenZH.slice(-7).map(function(d) {\n return {\n Date: d.date,\n TotalCases: d.ncumul_conf,\n NewCases: d.n_conf,\n Average: datenZHTagAvg.slice(-7).map(function(d) {\n return parseFloat(`${d.value}`).toFixed(1);\n })\n };\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2652,"value":"Last7DayDeaths = datenZH.slice(-7).map(function(d) {\n return {\n Date: d.date,\n TotalDeaths: d.ncumul_deceased,\n NewDeaths: d.n_deceased,\n Average: datenZHTagAvgDeceased.slice(-7).map(function(d) {\n return parseFloat(`${d.value}`).toFixed(1);\n })\n };\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2670,"value":"Last7DayHosp = datenZH.slice(-7).map(function(d) {\n let oldVent = 0;\n return {\n Date: d.date,\n TotalHosp: d.current_hosp,\n NewHosp: diffsHosp,\n TotalVent: d.current_vent,\n NewVent: diffsVent\n };\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3102,"value":"populationZH = 1536406","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"md`## Berechnungen`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"dateZH_extent = d3.extent(datenZH, d => d.date)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":320,"value":"valueZH_extent = d3.extent(datenZH, d => d.n_conf)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3057,"value":"hosp = datenZH.map(function(d) {\n return d.current_hosp;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2785,"value":"vent = datenZH.map(function(d) {\n return d.current_vent;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2749,"value":"diffsHosp = hosp\n .slice(1)\n .map((x, i) => x - hosp[i])\n .slice(-7)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2754,"value":"diffsVent = vent\n .slice(1)\n .map((x, i) => x - vent[i])\n .slice(-7)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"md`## Libraries, parameters and functions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1992,"value":"ch_DE = d3.timeFormatDefaultLocale({\n decimal: \".\",\n thousands: \"'\",\n grouping: [3],\n currency: [\"CHF\", \" \"],\n dateTime: \"%a %b %e %X %Y\",\n date: \"%d.%m.%Y\",\n time: \"%H:%M:%S\",\n periods: [\"AM\", \"PM\"],\n days: [\n \"Sonntag\",\n \"Montag\",\n \"Dienstag\",\n \"Mittwoch\",\n \"Donnerstag\",\n \"Freitag\",\n \"Samstag\"\n ],\n shortDays: [\"So\", \"Mo\", \"Di\", \"Mi\", \"Do\", \"Fr\", \"Sa\"],\n months: [\n \"Januar\",\n \"Februar\",\n \"März\",\n \"April\",\n \"Mai\",\n \"Juni\",\n \"Juli\",\n \"August\",\n \"September\",\n \"Oktober\",\n \"November\",\n \"Dezember\"\n ],\n shortMonths: [\n \"Jan\",\n \"Feb\",\n \"Mar\",\n \"Apr\",\n \"Mai\",\n \"Jun\",\n \"Jul\",\n \"Aug\",\n \"Sep\",\n \"Okt\",\n \"Nov\",\n \"Dez\"\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1977,"value":"xAxisM = g =>\n g.attr(\"transform\", `translate(0,${height - margin.bottom})`).call(\n d3\n .axisBottom(xScale)\n .tickSize('5')\n .ticks(d3.timeMonth)\n .tickSizeOuter(0)\n .tickFormat(ch_DE.format(\"%b\"))\n )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1344,"value":"lngOrg = 8.66","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1346,"value":"latOrg = 47.42","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1193,"value":"mouseOut = function() {\n d3.select('#mouseOverL').remove();\n d3.select('#mouseOverC').remove();\n\n d3.select('.Gemeinde')\n .selectAll('path')\n .style('stroke-width', 3)\n .style('fill-opacity', 1)\n .style('stroke-opacity', 1);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"height = 480","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":942,"value":"heightMap = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":926,"value":"padding = 10","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"margin = ({ top: 40, right: 30, bottom: 100, left: 50 })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":622,"value":"function movingAverage(values, N) {\n let i = 0;\n let sum = 0;\n const means = []; \n for (let n = Math.min(N - 1, values.length); i < n; ++i) {\n let mean = {};\n mean.value = NaN;\n mean.date = values[i][1];\n means[i] = mean;\n sum += values[i][0];\n }\n for (let n = values.length; i < n; ++i) {\n sum += values[i][0];\n let mean = {};\n mean.value = sum / N;\n mean.date = values[i][1];\n means[i] = mean;\n sum -= values[i - N + 1][0];\n }\n return means;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"parseTime = d3.timeParse(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":831,"value":"formatTime = d3.timeFormat(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"xScale = d3\n .scaleTime()\n .domain(dateZH_extent)\n .range([margin.left, widthNow - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2362,"value":"yScaleArea = d3.scaleLinear()\n .range([height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":294,"value":"xAxis = g =>\n g.attr(\"transform\", `translate(0,${height - margin.bottom})`).call(\n d3.axisBottom(xScale).tickFormat(d =>\n d.toLocaleString(\"de-CH\", {\n day: \"numeric\",\n month: \"short\"\n })\n )\n )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"yScaleF = function(type, extent) {\n if (type == 'linear') {\n return d3\n .scaleLinear()\n .domain([0, extent[1]])\n .range([height - margin.bottom, margin.top]);\n } else if (type == 'log') {\n return d3\n .scaleLog()\n .domain([1, valueZH_extent[1]])\n .range([height - margin.bottom, margin.top]);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":787,"value":"bisect = {\n const bisectDate = d3.bisector(d => d.date).left;\n return (data, date) => {\n const i = bisectDate(data, date, 1);\n const a = data[i - 1],\n b = data[i];\n return date - a.date > b.date - date ? b : a;\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"//metadata = getMetadata(odswissId)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"function getMetadata(odswissId) {\n let link =\n \"https://opendata.swiss/api/3/action/package_show?id=\" +\n odswissId;\n const metadata = d3.json(link);\n //https://opendata.swiss/api/3/action/package_show?id=\n return metadata;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1771,"value":"d3= require('d3')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3064,"value":"import {radio} from \"@rohscx/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"html`