2c:null 2d:["$","title",null,{"children":"Analyse van de COVID cijfers in België | Bart Mesuere | Observable"}] 32:T139c,{ // the bars of the top graph const bars = vl .markBar({ width: 2 }) .encode( vl.x().fieldT("DATE"), // one bar per day along the x-axis vl.y().sum("CASES"), // for each day, sum the number of new cases vl.opacity().value(0.4), // make the bars less prominent vl .color() /*.condition([ // last 3 in gray { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "gray" } ])*/ .value("steelblue"), // others in green vl.tooltip([ // add a tooltip to the bars { field: "DATE", type: "temporal", title: 'Datum' }, { field: "CASES", aggregate: "sum", title: "Nieuwe gevallen" } ]) ) .width(800); // the average line on the top graph const average = vl .markLine({ interpolate: "monotone" }) // draw a slightly smoother line // first calculate some secondary data points .transform( // calculate a rolling average with a window of the 6 days and today vl .groupby("PROVINCE") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), // sum the provinces for each day vl .groupby(["DATE", "INCOMPLETE"]) .aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")) ) .encode( vl .x() .fieldT("DATE") .title(null), // disable the title on the x-axis vl .y() .sum("AVG_CASES_BY_DATE") .title('Nieuwe gevallen per dag'), vl.tooltip().sum("AVG_CASES_BY_DATE") ); // the bottom graph const diff = vl .markBar({ width: 2 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("PROVINCE") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE").as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil dag ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(800) .height(150); // the bottom graph const diff2 = vl .markBar({ width: 2 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("PROVINCE") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE", 7).as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil week ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(800) .height(150); // concat the graphs and render return vl .vconcat(vl.layer(bars, average), diff, diff2) .data(province_grouped_cases.filter(d => new Date(d.DATE) <= new Date(d4))) .title("Evolutie nieuwe bevestigde besmettingen in België") .render(); }33:T12fa,{ // the bars of the top graph const bars = vl.markBar({width: 3}) .encode( vl.x().fieldT("DATE"), // one bar per day along the x-axis vl.y().sum("CASES"), // for each day, sum the number of new cases vl.opacity().value(0.4), // make the bars less prominent vl.color() /* .condition([ // last 3 in gray { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "gray" } ])*/ .value("steelblue"), // others in green vl.tooltip([ // add a tooltip to the bars {field: "DATE", type: "temporal", title: 'Datum'}, {field: "CASES", aggregate: "sum", title: "Nieuwe gevallen" } ]) ) .width(700); // the average line on the top graph const average = vl.markLine({interpolate: "monotone"}) // draw a slightly smoother line // first calculate some secondary data points .transform( // calculate a rolling average with a window of the 6 days and today vl.groupby("PROVINCE").window(vl.mean("CASES").as("AVG_CASES")).frame([-6,0]), // sum the provinces for each day vl.groupby(["DATE", "INCOMPLETE"]).aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")) ) .encode( vl.x() .fieldT("DATE") .title(null), // disable the title on the x-axis vl.y().sum("AVG_CASES_BY_DATE").title('Nieuwe gevallen per dag'), vl.tooltip().sum("AVG_CASES_BY_DATE") ); // the bottom graph const diff = vl.markBar({width: 3}) // first calculate some secondary data points .transform( // rolling average, same as above vl.groupby("PROVINCE").window(vl.mean("CASES").as("AVG_CASES")).frame([-6,0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl.window(vl.lag("AVG_CASES_BY_DATE").as("PREV_AVG_CASES_BY_DATE")).frame([-1,0]), // calculate the percentual difference between 2 days vl.calculate('datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1').as('DIFF') ) .encode( // draw the bars as before vl.x().fieldT("DATE").title(null), vl.y().sum("DIFF") .title('Verschil dag ervoor') .axis({format: ".0%"}), // format the values as percentage // color the bars according to a condition vl.color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ {field: "DATE", type: "temporal", title: 'Datum'}, {field: "DIFF", format: ".2%", title: 'Verschil'} ]) ) .width(700) .height(150); // the bottom graph const diff2 = vl.markBar({width: 3}) // first calculate some secondary data points .transform( // rolling average, same as above vl.groupby("PROVINCE").window(vl.mean("CASES").as("AVG_CASES")).frame([-6,0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl.window(vl.lag("AVG_CASES_BY_DATE", 7).as("PREV_AVG_CASES_BY_DATE")).frame([-1,0]), // calculate the percentual difference between 2 days vl.calculate('datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1').as('DIFF') ) .encode( // draw the bars as before vl.x().fieldT("DATE").title(null), vl.y().sum("DIFF") .title('Verschil week ervoor') .axis({format: ".0%"}), // format the values as percentage // color the bars according to a condition vl.color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ {field: "DATE", type: "temporal", title: 'Datum'}, {field: "DIFF", format: ".2%", title: 'Verschil'} ]) ) .width(700) .height(150); // concat the graphs and render return vl.vconcat(vl.layer(bars, average), diff, diff2) .title(`Evolutie nieuwe bevestigde besmettingen in ${province}`) .data(province_grouped_cases .filter(d => new Date(d.DATE) >= new Date("2021-11-03")) .filter(d => new Date(d.DATE) <= new Date("2022-03-03")) .filter(d => new Date(d.DATE) <= new Date(d4)) .filter(d => province == "België" ? true : d.PROVINCE == province) ) .render() }34:T1424,{ // the bars of the top graph const bars = vl .markBar({ width: 3 }) .encode( vl.x().fieldT("DATE"), // one bar per day along the x-axis vl.y().sum("CASES"), // for each day, sum the number of new cases vl.opacity().value(0.4), // make the bars less prominent vl .color() /* .condition([ // last 3 in gray { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "gray" } ])*/ .value("steelblue"), // others in green vl.tooltip([ // add a tooltip to the bars { field: "DATE", type: "temporal", title: 'Datum' }, { field: "CASES", aggregate: "sum", title: "Nieuwe gevallen" } ]) ) .width(700); // the average line on the top graph const average = vl .markLine({ interpolate: "monotone" }) // draw a slightly smoother line // first calculate some secondary data points .transform( // calculate a rolling average with a window of the 6 days and today vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), // sum the provinces for each day vl .groupby(["DATE", "INCOMPLETE"]) .aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")) ) .encode( vl .x() .fieldT("DATE") .title(null), // disable the title on the x-axis vl .y() .sum("AVG_CASES_BY_DATE") .title('Nieuwe gevallen per dag'), vl.tooltip().sum("AVG_CASES_BY_DATE") ); // the bottom graph const diff = vl .markBar({ width: 3 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE").as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil dag ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(700) .height(150); // the bottom graph const diff2 = vl .markBar({ width: 3 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE", 7).as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil week ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(700) .height(150); // concat the graphs and render return vl .vconcat(vl.layer(bars, average), diff, diff2) .title(`Evolutie nieuwe bevestigde besmettingen met leeftijd ${ag} jaar`) .data( age_grouped_cases .filter(d => new Date(d.DATE) >= new Date("2022-01-03")) .filter(d => new Date(d.DATE) <= new Date(d4)) .filter(d => d.AGEGROUP == ag) ) .render(); }35:T143f,{ // the bars of the top graph const bars = vl .markBar({ width: 3 }) .encode( vl.x().fieldT("DATE"), // one bar per day along the x-axis vl.y().sum("CASES"), // for each day, sum the number of new cases vl.opacity().value(0.4), // make the bars less prominent vl .color() /* .condition([ // last 3 in gray { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "gray" } ])*/ .value("steelblue"), // others in green vl.tooltip([ // add a tooltip to the bars { field: "DATE", type: "temporal", title: 'Datum' }, { field: "CASES", aggregate: "sum", title: "Nieuwe gevallen" } ]) ) .width(700); // the average line on the top graph const average = vl .markLine({ interpolate: "monotone" }) // draw a slightly smoother line // first calculate some secondary data points .transform( // calculate a rolling average with a window of the 6 days and today vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), // sum the provinces for each day vl .groupby(["DATE", "INCOMPLETE"]) .aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")) ) .encode( vl .x() .fieldT("DATE") .title(null), // disable the title on the x-axis vl .y() .sum("AVG_CASES_BY_DATE") .title('Nieuwe gevallen per dag'), vl.tooltip().sum("AVG_CASES_BY_DATE") ); // the bottom graph const diff = vl .markBar({ width: 3 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE").as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil dag ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(700) .height(150); // the bottom graph const diff2 = vl .markBar({ width: 3 }) // first calculate some secondary data points .transform( // rolling average, same as above vl .groupby("AGEGROUP") .window(vl.mean("CASES").as("AVG_CASES")) .frame([-6, 0]), vl.groupby("DATE").aggregate(vl.sum("AVG_CASES").as("AVG_CASES_BY_DATE")), // for each day, add a value containing the value of the previous day vl .window(vl.lag("AVG_CASES_BY_DATE", 7).as("PREV_AVG_CASES_BY_DATE")) .frame([-1, 0]), // calculate the percentual difference between 2 days vl .calculate( 'datum.PREV_AVG_CASES_BY_DATE == null ? 0 : (datum.AVG_CASES_BY_DATE / (datum.PREV_AVG_CASES_BY_DATE)) - 1' ) .as('DIFF') ) .encode( // draw the bars as before vl .x() .fieldT("DATE") .title(null), vl .y() .sum("DIFF") .title('Verschil week ervoor') .axis({ format: ".0%" }), // format the values as percentage // color the bars according to a condition vl .color() .condition([ // last 3 in gray // { test: "dayofyear(now()) - dayofyear(datum.DATE) < 4", value: "lightgray" }, // positive in orange { test: "datum.DIFF > 0", value: "orange" } ]) .value("green"), // others in green vl.tooltip([ { field: "DATE", type: "temporal", title: 'Datum' }, { field: "DIFF", format: ".2%", title: 'Verschil' } ]) ) .width(700) .height(150); // concat the graphs and render return vl .vconcat(vl.layer(bars, average), diff, diff2) .title(`Evolutie nieuwe bevestigde besmettingen met leeftijd 0-19 jaar`) .data( age_grouped_cases .filter(d => new Date(d.DATE) >= new Date("2022-01-03")) .filter(d => new Date(d.DATE) <= new Date(d4)) .filter(d => d.AGEGROUP == "0-9" || d.AGEGROUP == "10-19") ) .render(); }36:T731,{ // here we use the facet feature of vega to create subplots of each of the values of a data field const dots = vl.markCircle() .encode( vl.x().fieldT("DATE").axis({tickCount: 5}), vl.y().sum("NORMALIZED_CASES"), vl.opacity().value(0.3), vl.tooltip().fieldT('DATE') ); const average = vl.markLine({interpolate: "monotone"}) .transform( //vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-3,3]) vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-6,0]) ) .encode( vl.x().fieldT("DATE").title(null), vl.y().sum("ROLLING").title('gevallen per dag per 100k inwoners'), vl.tooltip().sum("ROLLING") ); const rule = vl.markRule() .data({"values": [{"name": "800 per dag nationaal", "ref": 100000*800/population["België"]}]}) .encode( vl.y().fieldQ("ref"), vl.color().fieldN("name") .scale({range: ["red"]}) .legend({ orient: "none", title:"Drempelwaarde besmettingen", legendX: 720, legendY: 720 }) ); return vl.layer(dots, average) .width(150).height(250) .facet({field: "PROVINCE", title: null, sort: ["Antwerpen", "Limburg", "Oost-Vlaanderen", "Vlaams-Brabant", "West-Vlaanderen", "Henegouwen", "Luik", "Luxemburg", "Namen", "Waals-Brabant", "Brussel"]}).columns(5) .resolve({scale: {x: 'independent'}}) // plot an x-axis on each graph instead of only at the bottom .data(extended_province_grouped_cases .filter(d => d.PROVINCE) .filter(d => new Date(d.DATE) >= new Date("2021-09-01")) .filter(d => ![d3s, d2, d1].includes(d.DATE)) ) .title({text: "Aantal nieuwe besmettingen per dag per 100k inwoners per provincie"}) .render() }37:T4e1,{ // here we use the facet feature of vega to create subplots of each of the values of a data field const dots = vl.markCircle() .encode( vl.x().fieldT("DATE").title(null), vl.y().sum("NORMALIZED_CASES"), vl.opacity().value(0.3), vl.tooltip().fieldT('DATE'), vl.color().field("PROVINCE").title(null).legend({orient: "right"}) ); const average = vl.markLine({interpolate: "monotone"}) .transform( //vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-3,3]) vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-6,0]) ) .encode( vl.x().fieldT("DATE"), vl.y().sum("ROLLING").title('gevallen per dag per 100k inwoners'), vl.color().field("PROVINCE") ); return vl.layer(dots, average) .width(600).height(300) .data(extended_province_grouped_cases .filter(d => d.PROVINCE === "Brussel" || d.PROVINCE === "Vlaanderen" || d.PROVINCE === "Wallonië") .filter(d => new Date(d.DATE) >= new Date("2022-01-03")) .filter(d => ![d3s, d2, d1].includes(d.DATE)) ) .title({text: "Aantal nieuwe bevestigde besmettingen per dag per 100k inwoners"}) .render() }38:T529,{ // here we use the facet feature of vega to create subplots of each of the values of a data field const dots = vl.markCircle() .encode( vl.x().fieldT("DATE").title(null), vl.y().sum("NORMALIZED_CASES"), vl.opacity().value(0.3), vl.tooltip().fieldT('DATE'), vl.color().field("PROVINCE").title(null).legend({orient: "right"}) ); const average = vl.markLine({interpolate: "monotone"}) .transform( //vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-3,3]) vl.groupby("PROVINCE").window(vl.mean("NORMALIZED_CASES").as("ROLLING")).frame([-6,0]) ) .encode( vl.x().fieldT("DATE").title(null), vl.y().sum("ROLLING").title('gevallen per dag per 100k inwoners'), vl.color().field("PROVINCE") ); return vl.layer(/*dots,*/ average) .width(600).height(300) .data(extended_province_grouped_cases .filter(d => d.PROVINCE === "Brussel" || d.PROVINCE === "Vlaanderen" || d.PROVINCE === "Wallonië") //.filter(d => d.PROVINCE === "Vlaanderen") //.filter(d => new Date(d.DATE) >= new Date("2021-04-12")) .filter(d => ![d3s, d2, d1].includes(d.DATE)) ) .title({text: "Aantal nieuwe bevestigde besmettingen per dag per 100k inwoners"}) .render() }39:T45c,{ // here we use the facet feature of vega to create subplots of each of the values of a data field const dots = vl.markLine().encode( vl .x() .fieldT("DATE") .title(null), vl .y() .sum("CASES") .title(null) /*.scale({type: "log", domainMin: 1, clamp: true})*/, vl .color() .fieldO("AGEGROUP") .title(null) .scale({ scheme: "turbo" }), vl.tooltip(vl.sum("CASES")) ); return ( vl .layer(dots) .width(500) .height(500) .title( "7-daags gemiddelde van aantal nieuwe gevallen per dag in " + province_age ) //.facet(vl.field('AGEGROUP')).columns(4) .resolve({ scale: { x: 'independent' } }) // plot an x-axis on each graph instead of only at the bottom .data( june_data .filter(d => d.PROVINCE == province_age) .filter(d => fromDecember.length > 0 ? new Date(d.DATE) >= new Date("2020-12-01") : true ) .filter(d => ![d3s, d2, d1].includes(d.DATE)) ) .render() ); }3a:T40f,{ // here we use the facet feature of vega to create subplots of each of the values of a data field const dots = vl.markArea({opacity: 0.8}).encode( vl .x() .fieldT("DATE") .title(null), vl .y() .sum("CASES") .stack("normalize") .axis({format: "%"}) .scale({domainMax: 0.1, clamp: true}) .title(null) /*.scale({type: "log", domainMin: 1, clamp: true})*/, vl .color() .fieldO("AGEGROUP") .title(null) .scale({ scheme: "turbo" }), vl.tooltip(vl.sum("CASES")) ); return ( vl .layer(dots) .width(500) .height(500) .title("Procentueel aantal gevallen per leeftijdsgroep") //.facet(vl.field('AGEGROUP')).columns(4) .resolve({ scale: { x: 'independent' } }) // plot an x-axis on each graph instead of only at the bottom .data( june_data .filter(d =>new Date(d.DATE) >= new Date("2021-09-01")) .filter(d => ![d3s, d2, d1].includes(d.DATE)) ) .render() ); }3b:T4a1,function heatmap(van, tot) { const squares = vl.markRect() .encode( vl.x().fieldN("AGEGROUP").title(null).axis({orient: "top"}), vl.y().fieldN("PROVINCE_CLEAN").title(null), vl.color().sum("DIFF").scale({domainMid: 0, scheme: 'redblue', reverse: true}).legend({title: null}) ); const text = vl.markText() .encode( vl.x().fieldN("AGEGROUP"), vl.y().fieldN("PROVINCE_CLEAN"), vl.text().sum("DIFF") ); const totalAge = vl.markText({fontStyle: "bold"}) .encode( vl.x().fieldN("AGEGROUP").title(null).axis(null), vl.text().sum("DIFF") ); const totalProvince = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.y().fieldN("PROVINCE_CLEAN").title(null).axis(null), vl.text().sum("DIFF") ); const totalTotal = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.text().sum("DIFF") ); return vl.hconcat(vl.vconcat(vl.layer(squares, text), totalAge), vl.vconcat(totalProvince, totalTotal)) .data(diff(van, tot)) .title(`Verschil in 7-daags totaal tussen ${van} en ${tot}`) .config({view: {stroke: null, step: 30}}) .render(); }3c:T906,function heatmap2(van, tot) { const squares = vl.markRect() .encode( vl.x().fieldN("AGEGROUP").title(null).axis({orient: "top"}), vl.y().fieldN("PROVINCE_CLEAN").title(null), vl.color().sum("CASES").scale({scheme: 'greens'}).legend({title: null, orient: "bottom"}) ); const text = vl.markText() .encode( vl.x().fieldN("AGEGROUP"), vl.y().fieldN("PROVINCE_CLEAN"), vl.text().sum("CASES") ); const totalAge = vl.markText({fontStyle: "bold"}) .encode( vl.x().fieldN("AGEGROUP").title(null).axis(null), vl.text().sum("CASES") ); const totalProvince = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.y().fieldN("PROVINCE_CLEAN").title(null).axis(null), vl.text().sum("CASES") ); const totalTotal = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.text().sum("CASES") ); const squares2 = vl.markRect() .encode( vl.x().fieldN("AGEGROUP").title(null).axis({orient: "top"}), vl.y().fieldN("PROVINCE_CLEAN").title(null), vl.color().sum("DIFF").scale({domainMid: 0, scheme: 'redblue', reverse: true}).legend({title: null, orient: "bottom"}) ); const text2 = vl.markText() .encode( vl.x().fieldN("AGEGROUP"), vl.y().fieldN("PROVINCE_CLEAN"), vl.text().sum("DIFF") ); const totalAge2 = vl.markText({fontStyle: "bold"}) .encode( vl.x().fieldN("AGEGROUP").title(null).axis(null), vl.text().sum("DIFF") ); const totalProvince2 = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.y().fieldN("PROVINCE_CLEAN").title(null).axis(null), vl.text().sum("DIFF") ); const totalTotal2 = vl.markText({fontStyle: "bold", align: "right"}) .encode( vl.text().sum("DIFF") ); return vl.hconcat( vl.hconcat(vl.vconcat(vl.layer(squares, text), totalAge), vl.vconcat(totalProvince, totalTotal)), vl.hconcat(vl.vconcat(vl.layer(squares2, text2), totalAge2), vl.vconcat(totalProvince2, totalTotal2)) ) .data(diff(van, tot)) .title(`Aantal bevestigde gevallen tussen ${van} en ${tot} en het verschil t.o.v. de week voordien`) .resolve({scale: {color: 'independent'}}) .config({view: {stroke: null, step: 35}}) .render(); }3d:T881,function heatmap3(van, tot) { const squares3 = vl.markRect() .encode( vl.x().fieldN("AGEGROUP").title(null).axis({orient: "top"}), vl.y().fieldN("PROVINCE_CLEAN").title(null), vl.color().fieldQ("REL").scale({domainMid: 1, scheme: 'redblue', reverse: true, clamp: true, type: "log", domain: [1/3, 3]}).legend({title: null, orient: "bottom", values: [1/2, 1, 2], labelExpr: "datum.value === 1 ? 'constant' : datum.value > 1 ? 'x' + datum.value : '/' + 1/datum.value"}) ).width(400).height(440); const text3 = vl.markText() .encode( vl.x().fieldN("AGEGROUP"), vl.y().fieldN("PROVINCE_CLEAN"), vl.text().sum("PDIFF").format(".0%") ); const totalAge3 = vl.markText({fontStyle: "bold"}) .transform( vl.groupby("AGEGROUP").aggregate(vl.sum("CASES").as("SUM_CASES"), vl.sum("DIFF").as("SUM_DIFF")), vl.calculate('(datum.SUM_CASES / (datum.SUM_CASES + (-1 * datum.SUM_DIFF))) - 1').as("PDIFF") ) .encode( vl.x().fieldN("AGEGROUP").title(null).axis(null), vl.text().fieldQ("PDIFF").format(".0%") ); const totalProvince3 = vl.markText({fontStyle: "bold", align: "right"}) .transform( vl.groupby("PROVINCE_CLEAN").aggregate(vl.sum("CASES").as("SUM_CASES"), vl.sum("DIFF").as("SUM_DIFF")), vl.calculate('(datum.SUM_CASES / (datum.SUM_CASES + (-1 * datum.SUM_DIFF))) - 1').as("PDIFF") ) .encode( vl.y().fieldN("PROVINCE_CLEAN").title(null).axis(null), vl.text().sum("PDIFF").format(".0%") ); const totalTotal3 = vl.markText({fontStyle: "bold", align: "right"}) .transform( vl.aggregate(vl.sum("CASES").as("SUM_CASES"), vl.sum("DIFF").as("SUM_DIFF")), vl.calculate('(datum.SUM_CASES / (datum.SUM_CASES + (-1 * datum.SUM_DIFF))) - 1').as("PDIFF") ) .encode( vl.text().sum("PDIFF").format(".0%") ); return vl.hconcat(vl.vconcat(vl.layer(squares3, text3), totalAge3), vl.vconcat(totalProvince3, totalTotal3)) .data(diff(van, tot)) .title(`Procentueel verschil tussen ${van} en ${tot}`) .resolve({scale: {color: 'independent'}}) .config({view: {stroke: null, step: 40}}) .render(); }3e:T484,june_young_old_data = { const result = []; Array.from(new Set(june_age_data.map(d => d.DATE))).forEach(date => { const y = june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "0-9")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "10-19")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "20-29")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "30-39")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "40-49")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "50-59")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "60-69")[0].CASES; const o = june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "70-79")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "80-89")[0].CASES + june_age_data.filter(d => d.DATE === date && d.AGEGROUP === "90+")[0].CASES; result.push({DATE: date, CASES: y/7, AGE: "0-69"}); result.push({DATE: date, CASES: o/7, AGE: "70+"}); }); return result; }3f:T870,extended_province_grouped_cases = { const result = []; const grouped = d3.rollup(cases, v => d3.sum(v, d => d.CASES), d => d.DATE, d => d.PROVINCE); dates.forEach(date => { provinces.forEach(province => { result.push({ DATE: date, PROVINCE: province, CASES: grouped.get(date).get(province) || 0, NORMALIZED_CASES: 100000*(grouped.get(date).get(province) || 0) / population[province] }); }); const vl = (grouped.get(date).get("WestVlaanderen") || 0) + (grouped.get(date).get("OostVlaanderen") || 0) + (grouped.get(date).get("Antwerpen") || 0) + (grouped.get(date).get("Limburg") || 0) + (grouped.get(date).get("VlaamsBrabant") || 0); const wal = (grouped.get(date).get("Liège") || 0) + (grouped.get(date).get("BrabantWallon") || 0) + (grouped.get(date).get("Hainaut") || 0) + (grouped.get(date).get("Namur") || 0) + (grouped.get(date).get("Luxembourg") || 0); const bel = vl + wal + (grouped.get(date).get("Brussels") || 0)+ (grouped.get(date).get(undefined) || 0); result.push({DATE: date, PROVINCE: "Vlaanderen", CASES: vl, NORMALIZED_CASES: 100000*vl / population["Vlaanderen"]}); result.push({DATE: date, PROVINCE: "Wallonië", CASES: wal, NORMALIZED_CASES: 100000*wal / population["Wallonië"]}); result.push({DATE: date, PROVINCE: "België", CASES: bel, NORMALIZED_CASES: 100000*bel / population["België"]}); }); result.forEach(d => { if(d.PROVINCE === "WestVlaanderen") d.PROVINCE = "West-Vlaanderen"; if(d.PROVINCE === "OostVlaanderen") d.PROVINCE = "Oost-Vlaanderen"; if(d.PROVINCE === "VlaamsBrabant") d.PROVINCE = "Vlaams-Brabant"; if(d.PROVINCE === "Liège") d.PROVINCE = "Luik"; if(d.PROVINCE === "BrabantWallon") d.PROVINCE = "Waals-Brabant"; if(d.PROVINCE === "Hainaut") d.PROVINCE = "Henegouwen"; if(d.PROVINCE === "Namur") d.PROVINCE = "Namen"; if(d.PROVINCE === "Luxembourg") d.PROVINCE = "Luxemburg"; if(d.PROVINCE === "Brussels") d.PROVINCE = "Brussel"; }); return result; }40:[] 30:{"id":"40cafeedda68be82","slug":"evolutie-positieve-testen","title":"Analyse van de COVID cijfers in België","thumbnail":"e0cddc585c393ccfbd42148b5871bb08c4bc71e16f5ed9e1828ce65a30485eee","access_level":"public","create_time":"$D2020-06-28T15:49:46.889Z","update_time":"$D2023-04-11T12:31:03.092Z","view_time":null,"first_public_time":"$D2020-06-28T19:22:32.493Z","has_unpublished_edits":null,"fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"1f20537af0cde79f","login":"bmesuere","name":"Bart Mesuere","avatar_url":"https://avatars-next.observableusercontent.com/eb2388e453b68d683131930d7e0b914d9c3d26dc21802c4e3c852e91ae6e1799","tier":"starter_2024"},"version":1732,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d42baac23e3ffb5f","login":"bmesuere","name":"Bart Mesuere","avatar_url":"https://avatars-next.observableusercontent.com/eb2388e453b68d683131930d7e0b914d9c3d26dc21802c4e3c852e91ae6e1799","tier":null}],"members":[{"type":"individual","id":"d42baac23e3ffb5f","login":"bmesuere","name":"Bart Mesuere","avatar_url":"https://avatars-next.observableusercontent.com/eb2388e453b68d683131930d7e0b914d9c3d26dc21802c4e3c852e91ae6e1799","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"15f1b04221d4e188","slug":"covid","title":"COVID","owner":{"id":"1f20537af0cde79f","login":"bmesuere","name":"Bart Mesuere"}},"type":"notebook","body":{"titling":"auto","title":"Analyse van de COVID cijfers in België","cells":[{"id":0,"value":"md`# Analyse van de COVID cijfers in België\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1073,"value":"md`**Overzicht**\n* [Algemene trend](#algemene_trend)\n* [Trend laatste maanden](#laatste_maanden)\n* [Per provincie](#per_provincie)\n* [Per leeftijd](#per_leeftijd)\n* [Jong vs. Oud](#jong_oud)\n* [Vergelijking vorige week](#vorige_week)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":331,"value":"algemene_trend = md`

\n## Algemene trend\n\nHieronder zien we een aantal grafieken die het aantal positieve gevallen weergeeft. Op de bovenste grafiek zien we telkens per dag een balkje dat het aantal positieve testen weergeeft dat die dag werd afgenomen. De cijfers van de laatste 2-3 dagen zijn dus niet niet volledig aangezien de resultaten daarvan nog niet allemaal gekend zijn. De volle lijn geeft het 7-daags gemiddelde weer.\n\nDaaronder zien we 2 staafdiagrammen die de evolutie van het 7-daags gemiddelde weergeven. De eerste vergelijkt met de dag ervoor, de onderste met een week geleden. Dit laatste cijfer wordt tegenwoordig gerapporteerd door de pers.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"laatste_maanden = md`

\n## De laatste maanden\nOm een duidelijker beeld te krijgen, kunnen we inzoomen op de laatste paar weken. Je kan ook filteren op 1 provincie:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1011,"value":"viewof province = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":311,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1401,"value":"viewof ag = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1397,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1678,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"per_provincie = md`

\n## Per provincie\nWe kunnen dezelfde grafiek ook opstellen per provincie.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":784,"value":"md`1 provincie uitgelicht:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1034,"value":"viewof province_detail = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":549,"value":"{\n // here we use the facet feature of vega to create subplots of each of the values of a data field\n const dots = vl.markCircle()\n .encode(\n vl.x().fieldT(\"DATE\"),\n vl.y().sum(\"CASES\"),\n vl.opacity().value(0.3),\n vl.tooltip().fieldT(\"DATE\")\n );\n \n const average = vl.markLine({interpolate: \"monotone\"})\n .transform(\n vl.groupby(\"PROVINCE\").window(vl.mean(\"CASES\").as(\"ROLLING\")).frame([-6,0])\n )\n .encode(\n vl.x().fieldT(\"DATE\").title(null),\n vl.y().sum(\"ROLLING\").title('Nieuwe gevallen per dag')\n );\n \n return vl.layer(dots, average)\n .title (province_detail)\n //.width(150).height(150)\n .data(extended_province_grouped_cases\n .filter(d => d.PROVINCE === province_detail)\n .filter(d => new Date(d.DATE) >= new Date(\"2020-06-01\"))\n .filter(d => ![d3s, d2, d1].includes(d.DATE)))\n .render()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1258,"value":"md`1 leeftijdscategorie uitgelicht`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1255,"value":"viewof agegroup_detail = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1215,"value":"{\n // here we use the facet feature of vega to create subplots of each of the values of a data field\n const dots = vl.markCircle()\n .encode(\n vl.x().fieldT(\"DATE\"),\n vl.y().sum(\"CASES\"),\n vl.opacity().value(0.3),\n vl.tooltip().fieldT(\"DATE\")\n );\n \n const average = vl.markLine({interpolate: \"monotone\"})\n .transform(\n vl.groupby(\"AGEGROUP\").window(vl.mean(\"CASES\").as(\"ROLLING\")).frame([-6,0])\n )\n .encode(\n vl.x().fieldT(\"DATE\").title(null),\n vl.y().sum(\"ROLLING\").title('Nieuwe gevallen per dag')\n );\n \n return vl.layer(dots, average)\n .title (agegroup_detail)\n .width(500)\n //.width(150).height(150)\n .data(age_grouped_cases\n .filter(d => d.AGEGROUP == agegroup_detail)\n .filter(d => new Date(d.DATE) >= new Date(\"2020-06-01\"))\n .filter(d => ![d3s, d2, d1].includes(d.DATE)))\n .render()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1527,"value":"age_grouped_cases","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1308,"value":"{\n // here we use the facet feature of vega to create subplots of each of the values of a data field\n const dots = vl.markCircle()\n .encode(\n vl.x().fieldT(\"DATE\"),\n vl.y().sum(\"CASES\"),\n vl.opacity().value(0.3),\n vl.tooltip().fieldT(\"DATE\")\n );\n \n const average = vl.markLine({interpolate: \"monotone\"})\n .transform(\n vl.groupby(\"AGEGROUP\").window(vl.mean(\"CASES\").as(\"ROLLING\")).frame([-6,0])\n )\n .encode(\n vl.x().fieldT(\"DATE\").title(null),\n vl.y().sum(\"ROLLING\").title('Nieuwe gevallen per dag'),\n vl.color().fieldN(\"AGEGROUP\").title(\"Leeftijdscategorie\")\n );\n \n return vl.layer(average)\n .title (\"Evolutie aantal gevallen 0-29 jaar\")\n //.width(150).height(150)\n .data(age_grouped_cases\n .filter(d => d.AGEGROUP == \"0-9\" || d.AGEGROUP == \"10-19\" || d.AGEGROUP == \"20-29\")\n .filter(d => new Date(d.DATE) >= new Date(\"2020-06-01\"))\n .filter(d => ![d3s, d2, d1].includes(d.DATE)))\n .render()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1356,"value":"cases_by_age = {\n const average = vl\n .markLine({ interpolate: \"monotone\" })\n .transform(\n vl\n .groupby(\"AGEGROUP\")\n .window(vl.mean(\"CASES\").as(\"ROLLING\"))\n .frame([-6, 0])\n )\n .encode(\n vl\n .x()\n .fieldT(\"DATE\")\n .title(null),\n vl\n .y()\n .sum(\"ROLLING\")\n .title('Bevestigde gevallen per dag'),\n vl\n .color()\n .fieldO(\"AGEGROUP\")\n .title(\"Leeftijdscategorie\")\n .scale({ scheme: \"turbo\" })\n );\n\n return (\n vl\n .layer(average)\n .title(\"Aantal bevestigde gevallen per leeftijdscategorie\")\n //.width(500).height(300)\n .data(\n age_grouped_cases\n .filter(d => d.AGEGROUP)\n .filter(d => new Date(d.DATE) >= new Date(\"2021-04-12\"))\n .filter(d => ![d3s, d2, d1].includes(d.DATE))\n )\n .render()\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1645,"value":"cases_by_age2 = {\n const average = vl\n .markLine({ interpolate: \"monotone\" })\n .transform(\n vl\n .groupby(\"AGEGROUP\")\n .window(vl.mean(\"CASES\").as(\"ROLLING\"))\n .frame([-6, 0])\n )\n .encode(\n vl\n .x()\n .fieldT(\"DATE\")\n .title(null),\n vl\n .y()\n .sum(\"ROLLING\")\n .title('Bevestigde gevallen per dag'),\n //vl.row().fieldO(\"AGEGROUP\"),\n vl\n .color()\n .fieldO(\"AGEGROUP\")\n .title(\"Leeftijdscategorie\")\n .scale({ scheme: \"turbo\" })\n );\n\n return (\n average\n .title(\"Aantal bevestigde gevallen per leeftijdscategorie\")\n .width(500).height(300)\n .data(\n age_grouped_cases\n .filter(d => d.AGEGROUP)\n .filter(d => new Date(d.DATE) >= new Date(\"2021-10-01\"))\n .filter(d => ![d3s, d2, d1].includes(d.DATE))\n )\n .render()\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":574,"value":"md`We kunnen ook normaliseren voor het aantal inwoners.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":710,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1613,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1670,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1082,"value":"per_leeftijd = md`

\n## Per leeftijd`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":"md`We kunnen op dezelde manier naar de data kijken per leeftijdsgroep.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1058,"value":"viewof province_age = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1502,"value":"viewof fromDecember = Checkbox([\"Vanaf december\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":818,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1681,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1531,"value":"{\n // here we use the facet feature of vega to create subplots of each of the values of a data field\n const dots = vl.markLine().encode(\n vl\n .x()\n .fieldT(\"DATE\")\n .title(null),\n vl\n .y()\n .sum(\"CASES\")\n .title(null) /*.scale({type: \"log\", domainMin: 1, clamp: true})*/,\n vl\n .row()\n .fieldO(\"AGEGROUP\")\n .title(null),\n vl.tooltip(vl.sum(\"CASES\"))\n );\n\n return (\n dots\n .width(500)\n .height(80)\n .title(\n \"7-daags lopend totaal aantal besmettingen\"\n )\n //.facet(vl.field('AGEGROUP')).columns(4)\n .resolve({ scale: { y: 'independent' } }) // plot an x-axis on each graph instead of only at the bottom\n .data(\n june_data\n .filter(d =>\n fromDecember.length > 0\n ? new Date(d.DATE) >= new Date(\"2020-12-01\")\n : true\n )\n .filter(d => ![d3s, d2, d1].includes(d.DATE))\n )\n .render()\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":907,"value":"jong_oud = md`

\n## Verdeling tussen jong en oud`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":894,"value":"{\n // here we use the facet feature of vega to create subplots of each of the values of a data field\n const dots = vl.markLine()\n .encode(\n vl.x().fieldT(\"DATE\").title(null),\n vl.y().sum(\"CASES\").title(null).scale({type: \"log\"}),\n vl.color().fieldN(\"AGE\").title(\"Leeftijd\").legend({orient: \"bottom\"}),\n vl.tooltip(vl.sum(\"CASES\"))\n );\n \n return vl.vconcat(dots)\n .title(\"Gemiddeld aantal bevestigde besmettingen per dag, log-plot\")\n //.facet(vl.field('AGEGROUP')).columns(4)\n .resolve({scale: {x: 'independent'}}) // plot an x-axis on each graph instead of only at the bottom\n .data(june_young_old_data.filter(d => ![d3s, d2, d1].includes(d.DATE)))\n .render()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"vorige_week = md`

\n## Vergelijking met vorige week en maand\nAls we enkel het lopende totaal van 2 dagen willen vergelijken, dan is een heatmap een betere voorstelling. We kunnen bv gisteren met vandaag vergelijken:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":240,"value":"heatmap(day_before, d4)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":191,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":267,"value":"md`Sciensano vergelijkt telkens de cijfers met de week voordien:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":613,"value":"heatmap2(week_before, d4)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":635,"value":"md`Gevallen zonder leeftijd of woonplaats werden niet opgenomen in de grafiek.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1120,"value":"heatmap3(week_before, d4)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1571,"value":"diff(week_before, d4)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":610,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1117,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":203,"value":"function diff (van, tot) {\n const result = [];\n const grouped = d3.rollup(june_data, v => v, d => d.PROVINCE, d => d.AGEGROUP, d => d.DATE);\n provinces.forEach(province => {\n agegroups.forEach(group => {\n const c = grouped.get(province) ? grouped.get(province).get(group) : null;\n if (c) {\n let p = (c.get(tot)[0].CASES / c.get(van)[0].CASES) -1;\n p = p === Infinity ? NaN : p;\n let rel = c.get(tot)[0].CASES / c.get(van)[0].CASES;\n rel = rel === Infinity ? NaN : rel;\n const d = c.get(tot)[0].CASES - c.get(van)[0].CASES;\n const e = c.get(tot)[0].CASES;\n result.push({DATE: tot, PROVINCE: province, PROVINCE_CLEAN: provinceClean[province], AGEGROUP: group, DIFF: d, CASES: e, PDIFF: p, REL: rel});\n }\n });\n });\n return result; \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":518,"value":"today = d.timeFormat(\"%Y-%m-%d\")(d.timeHour.offset(Date.now(), -4))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":750,"value":"d1 = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(today), -1))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":743,"value":"d2 = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(today), -2))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":742,"value":"d3s = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(today), -3))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":525,"value":"d4 = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(today), -4))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":532,"value":"day_before = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(d4), -1))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":535,"value":"week_before = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(d4), -7))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":538,"value":"two_weeks_before = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(d4), -14))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":542,"value":"month_before = d.timeFormat(\"%Y-%m-%d\")(d.timeDay.offset(Date.parse(d4), -30))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":888,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"june_province_data = {\n const result = [];\n const june_cases = province_grouped_cases.filter(l => l.DATE && (new Date(l.DATE) >= new Date(\"2020-06-01\")));\n const by_province = new Map(d3.groups(june_cases, d => d.PROVINCE))\n provinces.forEach(province => {\n const c = by_province.get(province);\n for (let i = 6; i < c.length; i++) {\n const sum = c[i-6].CASES + c[i-5].CASES + c[i-4].CASES + c[i-3].CASES + c[i-2].CASES + c[i-1].CASES + c[i-0].CASES;\n result.push({DATE: c[i].DATE, PROVINCE: province, CASES: sum});\n }\n });\n return result; \n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":139,"value":"june_age_data = {\n const result = [];\n const june_cases = age_grouped_cases.filter(l => l.DATE && (new Date(l.DATE) >= new Date(\"2020-06-01\")));\n const by_group = new Map(d3.groups(june_cases, d => d.AGEGROUP))\n agegroups.forEach(group => {\n const c = by_group.get(group);\n for (let i = 6; i < c.length; i++) {\n const sum = c[i-6].CASES + c[i-5].CASES + c[i-4].CASES + c[i-3].CASES + c[i-2].CASES + c[i-1].CASES + c[i-0].CASES;\n result.push({DATE: c[i].DATE, AGEGROUP: group, CASES: sum});\n }\n });\n return result; \n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"june_data = {\n const result = [];\n const june_cases = grouped_cases.filter(l => l.DATE && (new Date(l.DATE) >= new Date(\"2020-06-01\")));\n const grouped = d3.rollup(june_cases, v => v, d => d.PROVINCE, d => d.AGEGROUP);\n provinces.forEach(province => {\n agegroups.forEach(group => {\n const c = grouped.get(province).get(group);\n for (let i = 6; i < c.length; i++) {\n const sum = c[i-6].CASES + c[i-5].CASES + c[i-4].CASES + c[i-3].CASES + c[i-2].CASES + c[i-1].CASES + c[i-0].CASES;\n result.push({DATE: c[i].DATE, PROVINCE: province, AGEGROUP: group, CASES: sum});\n }\n });\n });\n return result.filter(r => r.PROVINCE !== undefined && r.AGEGROUP !== undefined); \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"cases = (await fetch('https://epistat.sciensano.be/Data/COVID19BE_CASES_AGESEX.json')).json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"province_grouped_cases = {\n let result = [];\n const grouped = d3.rollup(cases, v => d3.sum(v, d => d.CASES), d => d.DATE, d => d.PROVINCE);\n dates.forEach(date => {\n provinces.forEach(province => {\n result.push({DATE: date, PROVINCE: province, CASES: grouped.get(date).get(province) || 0});\n });\n });\n result = result.map(d => {\n d.INCOMPLETE = false;\n if ([d3s, d2, d1].includes(d.DATE)) d.INCOMPLETE = true;\n return d;\n });\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":720,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":134,"value":"age_grouped_cases = {\n const result = [];\n const grouped = d3.rollup(cases, v => d3.sum(v, d => d.CASES), d => d.DATE, d => d.AGEGROUP);\n dates.forEach(date => {\n agegroups.forEach(group => {\n result.push({DATE: date, AGEGROUP: group, CASES: grouped.get(date).get(group) || 0});\n });\n });\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"grouped_cases = {\n const result = [];\n const grouped = d3.rollup(cases, v => d3.sum(v, d => d.CASES), d => d.DATE, d => d.PROVINCE, d => d.AGEGROUP);\n dates.forEach(date => {\n provinces.forEach(province => {\n agegroups.forEach(group => {\n result.push({DATE: date, PROVINCE: province, AGEGROUP: group, CASES: grouped.get(date).get(province) ? grouped.get(date).get(province).get(group) || 0 : 0});\n });\n });\n });\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"dates = Array.from(new Set(cases.map(c => c.DATE)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"provinces = Array.from(new Set(cases.map(c => c.PROVINCE)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1039,"value":"cleanProvinces = Array.from(new Set(extended_province_grouped_cases.map(d => d.PROVINCE)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1044,"value":"provinceClean = {\n return {\n Antwerpen: \"Antwerpen\",\n Brussels: \"Brussel\",\n Liège: \"Luik\",\n Limburg: \"Limburg\",\n OostVlaanderen: \"Oost-Vlaanderen\",\n VlaamsBrabant: \"Vlaams-Brabant\",\n BrabantWallon: \"Waals-Brabant\",\n WestVlaanderen: \"West-Vlaanderen\",\n Hainaut: \"Henegouwen\",\n Namur: \"Namen\",\n Luxembourg: \"Luxemburg\"\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"agegroups = Array.from(new Set(cases.map(c => c.AGEGROUP))).sort()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":569,"value":"population = {\n return {\n Antwerpen: 1872841,\n Brussels: 1214550,\n Liège: 1107937,\n Limburg: 879933,\n OostVlaanderen: 1530773,\n VlaamsBrabant: 1161430,\n WestVlaanderen: 1202529,\n BrabantWallon: 407377,\n Hainaut: 1344483,\n Namur: 496795,\n Luxembourg: 288515,\n Vlaanderen: 6647506,\n Wallonië: 3645243,\n België: 11507163,\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"d3 = require(\"d3-array@^2.2\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":520,"value":"d = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"import {vl} from '@vega/vega-lite-api'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1499,"value":"import { Checkbox } from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W40","stdlib":"1"}} 31:"$30:body"