Public
Edited
Apr 3, 2023
covid = fetch("https://covid.ourworldindata.org/data/owid-covid-data.json").then((response) => response.json())
numberOfCountries = Object.keys(covid).length
covid.MEX.data[covid.MEX.data.length-1]
covid.MEX.data[1010]
covid.MEX
covid.MEX.data[covid.MEX.data.length-1].total_deaths/covid.MEX.population * 1e6 - covid.MEX.data[covid.MEX.data.length-1].total_deaths_per_million
covid.MEX.data
covid.MEX.data[100].total_deaths
maxDeathsInMex = d3.max(covid.MEX.data.map(d => d.total_deaths))
maxCasesInMex = d3.max(covid.MEX.data.map(d => d.total_cases))
Plot.plot({
marks: [
Plot.line(covid.MEX.data, {
x: d => new Date(d.date),
y: d => d["total_deaths"] / maxDeathsInMex
}),
Plot.line(covid.MEX.data, {
x: d => new Date(d.date),
y: d => d["total_cases"]/ maxCasesInMex
})
],
//legend:true,
x: {
label:'Date →',
},
options:{
legend : ['Deaths', 'Cases']}
})
Plot.plot({
marks: [
Plot.line(covid.MEX.data, {
x: d => new Date(d.date),
y: d => d["total_deaths"] / d["total_cases"]
})
],
x: {
label:'Date →',
},
y: {
label:'↑ Death / Cases'
}
})
Plot.plot({
marks: [
Plot.line(covid.MEX.data, {
x: d => new Date(d.date),
y: d => d["total_vaccinations"] / 1e6
})
],
x:{
label: "Date →"
}
})
Plot.plot({
marks: [
Plot.line(covid.MEX.data, {
x: d => new Date(d.date),
y: "stringency_index"
})
],
x:{
label:'Date →'
},
y:{
label:'↑ Stringency Index'
}
})
Plot.plot({
marks: [
Plot.line([{x:0, y:0},{x:1, y:10}],
{x:"x", y:"y"})
],
//x:{label:'x →'},
y:{label:'↑ y'}
})
[1,2,4,2, NaN].reduce((a, c) => Math.max(a, c ? c : 0))
d3.max([1,2,4,2, NaN])
a = 20
function my(a, b, c){a+a; return a + b + c}
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.
