Technologist passionate about Data Visualization & Creative Coding. DevRel @ Google Japan. all opinions are mine.
Published
Edited
May 14, 2022
Observable Plot : Line Chart
Observable Plot で Line Chart (線グラフ) を描くチュートリアル。
まず、下記のようなデータを用意します。
このデータは、1983年から2018年の住宅価格の推移です。このような時間軸を持ったデータの場合は、Line Chart での表現が一番適しています。
csv をパースする際には、最後に引数で d3.autotype をつけてあげると自動で String 形式ではなく、適切な Number とかのObject に変換してくれるので便利ですよ。
Plot.plot({
y: {
grid: true
},
marks: [
Plot.line(data, {x: "date", y: "price"})
]
})
Type Markdown, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
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.
