statusCode = fetch('https://raw.githubusercontent.com/owid/covid-19-data/master/public/data/jhu/weekly_cases.csv').then(function(response) {
console.log(response.status); // returns 200
return response.status;
});
//data = d3.csv("https://raw.githubusercontent.com/owid/covid-19-data/master/public/data/jhu/weekly_cases.csv")
viewof table = aq // viewof shows the table view, but assigns the table value
.fromCSV(await FileAttachment('new_cases.csv').text())
.view({ height: 240 }) // set maximum height of table viewer in pixels
viewof table2 = aq // viewof shows the table view, but assigns the table value
.fromCSV(await FileAttachment('new_deaths.csv').text())
.view({ height: 240 }) // set maximum height of table viewer in pixels
regionList = [...new Set(locations.select('continent')._data.continent.data)].slice(1).concat("date")
viewof dt2 = table2.select(regionList).view()
dt = table.select(regionList)
dt.select(regionList)
.view({ height: 500 }) // set maximum height of table viewer in pixels
dt.view({ height: 500 }) // set maximum height of table viewer in pixels
convetingDate = (string) => { return new Date(string)}
op.year("2020-04-30")
viewof data_ = dt2.derive({year: d=> op.year(d.date)})
.derive({week: d=> op.week(d.date)})
.derive({yearWeek: d=> d.year + "-"+ d.week}).view()
data = data_.impute({ Europe: () => 0 })
.impute({ Africa: () => 0 })
.impute({ "North America": () => 0 })
.impute({ "South America": () => 0 })
.impute({ "Oceania": () => 0 })
viewof cumu_data = data
.derive({ raAsia: aq.rolling(d => op.sum(d.Asia)) })
.derive({ raEurope: aq.rolling(d => op.sum(d.Europe))})
.derive({ "ra North America": aq.rolling(d => op.sum(d["North America"])) })
.derive({ "ra South America": aq.rolling(d => op.sum(d["South America"])) })
.derive({ raAfrica: aq.rolling(d => op.sum(d.Africa)) })
.derive({ raOceania: aq.rolling(d => op.sum(d.Oceania))}).view()
weeklyNum2 = data.fold(data.columnNames().splice(0,7))
.rename({ key: 'region' }).rename({ value: 'dailyNum' })
.groupby('yearWeek')
.pivot('region', { weeklyNum: d => op.sum(d.dailyNum) }).view()
cumu_data.fold(data.columnNames().splice(0,6))
.rename({ key: 'region' })
.rename({ value: 'dailyNum' })
.groupby('yearWeek')
.pivot('region', { weeklyNum: d => op.sum(d.dailyNum) }).view()
//desiredData2= [...cumu_weekMap].map(d=>d[1])
viewof weeklyNum = data.fold(data.columnNames().splice(0,6))
.rename({ key: 'region' })
.rename({ value: 'dailyNum' })
.groupby('yearWeek')
.pivot('region', { weeklyNum: d => op.sum(d.dailyNum) }).view()
viewof cumu_weeklyNum = weeklyNum
.derive({ Asia: aq.rolling(d => op.sum(d.Asia)) })
.derive({ Europe: aq.rolling(d => op.sum(d.Europe))})
.derive({ "North America": aq.rolling(d => op.sum(d["North America"])) })
.derive({ "South America": aq.rolling(d => op.sum(d["South America"])) })
.derive({ Africa: aq.rolling(d => op.sum(d.Africa)) })
.derive({ Oceania: aq.rolling(d => op.sum(d.Oceania))})
.view()
cumu_weekMap = cumu_weeklyNum.fold(data.columnNames().splice(0,6))
.rename({ key: 'region' })
.rename({ value: 'deaths' })
.groupby('yearWeek')
.objects({ grouped: true })
data.view()
weekMap = weeklyNum.fold(data.columnNames().splice(0,6))
.rename({ key: 'region' })
.rename({ value: 'deaths' })
.groupby('yearWeek')
.objects({ grouped: true })
weekMapWithPadding =weeklyNumWithPadding.fold(data.columnNames().splice(0,6))
.rename({ key: 'region' })
.rename({ value: 'deaths' })
.groupby('yearWeek')
.objects({ grouped: true })
weeklyNum.view()
viewof firstTwoRows = aq.table({ yearWeek: ["2020-1", "2020-2"], Africa: [0,0], Asia: [0,0], Europe: [0,0], "North America": [0,0], Oceania: [0,0], "South America": [0,0], }).view()
viewof weeklyNumWithPadding = firstTwoRows.concat(cumu_weeklyNum).view()
weekMapWithPadding
// arr = [...weekMap].map(([name, value]) => ({ name, value }))
w = [...weekMap]
w[0]
desiredData = [...weekMap].map(d=>d[1])
desiredDataWithPadding = [...weekMapWithPadding].map(d=>d[1])
cloneWeekMap = [...weekMap]
desiredData1 = desiredData
function fillerCreator(yearWeekStr){
let cloneDesireData = [...desiredData]
let d = cloneDesireData[0]
d.map(d=> d.yearWeek = yearWeekStr)
d.map(d=> d.deaths = 0)
return d
}
[fillerCreator("2020-1"), fillerCreator("2020-2")].concat(desiredData)
fillerCreator("2020-1").concat(desiredData)
fillerCreator("2020-2")
desiredData2 = [...cumu_weekMap].map(d=>d[1])
// select one row
table.filter(d => op.abs(d.date) === "2021-09-14T00:00:00.000Z")
viewof locations = aq // viewof shows the table view, but assigns the table value
.fromCSV(await FileAttachment('locations.csv').text()).select("location", "continent")
.view({ height: 240 }) // set maximum height of table viewer in pixels
table
edge = label => md` — \`${label}\` ⟶`
function hconcat(...elem) {
const span = html`<span></span>`;
elem.forEach(e => {
e.style.display = 'inline-block';
e.style.verticalAlign = 'top';
e.style.marginRight = '1em';
span.appendChild(e);
});
return span;
}
categories = d3.schemeTableau10
.filter((c, i) => i !== 2)
.map(c => opacity(d3.color(c).brighter(), 0.3))
opacity = (c, value) => {
c = d3.color(c);
c.opacity = value;
return 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.
