Published
Edited
Mar 8, 2022
2 stars
Insert cell
Insert cell
Insert cell
caffeine_data = d3.csvParse(`drink,value
エスプレッソ,212
玉露,160
コーヒー,60
モンスターエナジー,40
レッドブル,30
紅茶(マサラチャイ),30
烏龍茶,20
煎茶,20
ほうじ茶,20
玄米茶,10
番茶,10
コーラ,9.5
ペプシコーラ,10.4
オロナミンC,15.3
バーブティー,0
`)
Insert cell
Plot.plot({
x: {
//日本語だと順番が崩れるのでValueが多い順に並べるように明示的に指定する
domain: d3.sort(caffeine_data, d => -d.value).map(d => d.drink)
},
marks:[
Plot.barY(caffeine_data, {x: "drink", y:"value"})
]
})
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