The avatar for @sugi2000
SUGIMOTO Tatsuo
Designer, Artist, Researcher, Educator @sugi2000lab . co-translator for Japanese edition of “Generative Design” and “Code as Creative Medium”.
Published
COVID-19
Edited
Jan 3, 2021
2 forks
3 stars
6
COVID-19
Heatmap of COVID-19 Confirmed Cases by Age over Time in JapanHeatmap of COVID-19 Confirmed Cases by Age over Time in Kyushu and Okinawa, Japan
Calendar of COVID-19 Confirmed Cases in Tokyo
[Internal] COVID-19 Confirmed Cases by Municipality in TokyoInternal page for COVID-19 in OsakaCOVID-19 Confirmed Cases in OsakaCOVID-19 Confirmed Cases by Municipality in TokyoCOVID-19 in OsakaCOVID-19 in HokkaidoCOVID-19 Data in JapanCOVID-19 Data in OsakaCOVID-19 in Japan Time ChartJapan Prefectural Grid MapCOVID-19 Data in HokkaidoCOVID-19 Data in TokyoCOVID-19 Data in Hyogo Pref., JapanCOVID-19 Data in FukuokaCOVID-19 Confirmed Cases in Japan by Day of the WeekCoronavirus Vaccinations in JapanHeatmap of COVID-19 Confirmed Cases in Tokyo
Insert cell
Insert cell
Insert cell
getYearData(2020).values
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
getYearData(2020)
Insert cell
Insert cell
yearsDates(dates)
Insert cell
Insert cell
Insert cell
dates.slice(-1)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
new Date(new Date(weeks[0]).setDate(weeks[0].getDate() - 7))
Insert cell
weeks = d3.range(-27, 1).map(d => {
const originDate = new Date(getLatestDate(cases).getTime()); //new Date('2020-11-01');

return new Date(originDate.setDate(originDate.getDate() + d * 7));
})
Insert cell
ages
Insert cell
ages.find(d => d === "10代")
Insert cell
getAges(casesOfWeek(weeks[0]))
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
color = d3.scaleSequentialLog(d3.interpolateInferno).domain([1, 100])
Insert cell
colorLegend
Insert cell
{
const age = '20代';
return d3.max(
casesByDate
.filter(d => d.date.getTime() >= new Date(2020, 3, 1))
.map(({ date, values }) => ({
date,
count: values.filter(d => d.age === age).length,
rate:
(values.filter(d => d.age === age).length /
getResidentsOfAgeGroup(age)) *
1000000
})),
d => d.rate
);
}
Insert cell
Insert cell
Insert cell
Insert cell
getAges = cases =>
Array.from(d3.groups(cases, d => d.age), ([key, values]) => ({
key,
values
})) //.sort((a, b) => b.key - a.key)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
agesData = Array.from(d3.groups(cases, d => d.age), ([key, values]) => ({
key,
values
}))
Insert cell
+'40代'.replace(/(\d+).+/, '$1')
Insert cell
Insert cell
Insert cell
Insert cell
await fetch('https://cors-anywhere.herokuapp.com/')
Insert cell
d3.buffer(`https://sugi2000cors.herokuapp.com/${caseDataUri}`)
Insert cell
caseDataUri = 'https://stopcovid19.metro.tokyo.lg.jp/data/130001_tokyo_covid19_patients.csv'
Insert cell
Insert cell
positive_by_developed = d3.json(
'https://raw.githubusercontent.com/tokyo-metropolitan-gov/covid19/development/data/positive_by_developed.json',
d3.autoType
)
Insert cell
Insert cell
getResidentsOfAgeGroup('10歳未満')
Insert cell
Insert cell
Insert cell
d3.sum(residentsByAge, d => d.population)
Insert cell
Insert cell
Insert cell
tokyoDeaths = getPrefectureData({ prefName: 'Tokyo' })
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more