Published
Edited
Jul 19, 2021
1 star
prevalenceChartData =
prevalence.data
.map(d => ({
...d,
prevalence: d.present / d.tested,
weekStart: isoWeekStart(d.week),
}))
.map(d => ({ ...d, ...pathogens[d.organism] }))
.map(d => ({ ...d, tooltip: prevalenceTooltip(d) }))
.filter(d => d.week !== currentWeek)
pathogens = ({
// Areas stack bottom up in order from least → greatest; e.g. Rhinovirus at 0 is on bottom.
"Human_coronavirus.2019": {order: 11, color: "#d62728", label: "SARS-CoV-2"},
"Influenza.A.H3N2": {order: 10, color: "#6b6ecf", label: "Influenza A (H3N2)"},
"Influenza.A.H1N1": {order: 9, color: "#5254a3", label: "Influenza A (H1N1)"},
"Influenza.B": {order: 8, color: "#9c9ede", label: "Influenza B"},
"RSV.A": {order: 7, color: "#2ca02c", label: "RSV A"},
"RSV.B": {order: 6, color: "#98df8a", label: "RSV B"},
"Human_coronavirus": {order: 5, color: "#e377c2", label: "Seasonal coronavirus"},
"Adenovirus": {order: 4, color: "#8c564b", label: "Adenovirus"},
"Enterovirus": {order: 3, color: "#fdbf6f", label: "Enterovirus"},
"Human_metapneumovirus": {order: 2, color: "#e6ab02", label: "Human metapneumovirus"},
"Human_parainfluenza": {order: 1, color: "#ffff99", label: "Human parainfluenza"},
"Rhinovirus": {order: 0, color: "#9edae5", label: "Rhinovirus"},
})
prevalenceTooltip = d => {
let pct = d3.format('.0%');
let n = d3.format(',');
return `${pct(d.prevalence)} (${n(d.present)}/${n(d.tested)}) ${d.label} during ${d.week}`;
}
specimensUrl = "https://data.seattleflu.org/specimens.csv"
specimens = parseCsv(specimensUrl)
specimensChartData =
specimens.data
.map(d => ({
...d,
weekStart: isoWeekStart(d.week),
}))
.map(d => ({ ...d, ...collectionChannels[d.collection_channel] }))
.map(d => ({ ...d, tooltip: specimensTooltip(d) }))
.filter(d => d.week !== currentWeek)
Inputs.table(specimensChartData.map(flatten))
collectionChannels = ({
"Public space": { order: 1, color: "#8da0cb" },
"College campus": { order: 2, color: "#fc8d62" },
"Swab-n-send": { order: 3, color: "#a6d854" },
"Clinical residuals": { order: 4, color: "#e78ac3" },
"Shelter": { order: 5, color: "#e5c494" },
"City testing sites": { order: 6, color: "#ffd92f" },
"Childcare": { order: 7, color: "#66c2a5" },
"Other": { order: 8, color: "#b3b3b3" },
})
specimensTooltip = d => {
let pct = d3.format('.0%');
let n = d3.format(',');
return `${pct(d.proportion_of_week)} (${n(d.specimens)}) ${d.collection_channel} during ${d.week}`;
}
parseCsv = async (url) => {
let response = await fetch(url);
let body = await response.text();
return {
data: d3.csvParse(body, d3.autoType),
lastModified: new Date(response.headers.get("Last-Modified")),
};
}
flatten = require("flat@5.0.2/index.js").catch(() => window.flatten)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
