cases = d3.csv('https://data.sfgov.org/resource/gyr2-k29z.csv?$limit=5000', d3.autoType)
deaths = d3.csv('https://data.sfgov.org/resource/g2di-xufg.csv?$limit=5000', d3.autoType)
tests = d3.csv('https://data.sfgov.org/resource/nfpa-mg4g.csv?$limit=5000', d3.autoType)
testsTidy = tests.flatMap(({ specimen_collection_date, pct, tests, last_updated_at, data_loaded_at, ...rest }) => {
return Object.entries(rest).map(([ result, specimens]) => ({
specimen_collection_date, result, specimens: +specimens
}))
})
hospitalizations = d3.csv('https://data.sfgov.org/resource/nxjg-bhem.csv?$limit=5000', d3.autoType)
vaccinations = d3.csv('https://data.sfgov.org/resource/bqge-2y7k.csv?$limit=5000', d3.autoType)
domain = [
d3.min([
d3.min(cases, (d) => d.specimen_collection_date),
d3.min(tests, (d) => d.specimen_collection_date),
d3.min(hospitalizations, (d) => d.reportdate)
]),
d3.timeDay.ceil(new Date())
]
options = ({
width,
height: Math.min(width / 1.8, 250),
y: { axis: "right" },
x: {
domain,
ticks: 6
},
marginLeft: 0,
marginRight: 50
})
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.
