Notebooks 2.0 is here.

Public
Edited
Feb 20, 2024
Insert cell
Insert cell
timeless_url = "https://pudding.cool/2017/03/timeless/90s_data.csv"
Insert cell
Insert cell
timeless = d3.csv(timeless_url, d3.autoType)
Insert cell
Inputs.table(timeless)
Insert cell
data = aq
.from(timeless)
.select("artist", "track", "year", "counts")

//.groupby("artist", "track", "year", "counts")
//.rollup({ max_count: aq.op.max("counts")})
//.groupby("year")
//artist compare commonartists and counts should be greater than comparison
Insert cell
data2 = aq.from(data)

Insert cell
data
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Inputs.table(data)
Insert cell
Insert cell
Plot.plot({
height: 500,
width: width,
marks: [Plot.dot(timeless, { x: "counts", y: "year", fill: "grey", opacity: 0.5, r: 9.5 }),
Plot.dot(timeless, Plot.pointer({ x: "counts", y: "year", fill: "grey", opacity: 1, r: 12})),
Plot.tip(timeless, Plot.pointer( {x: "counts", y: "year", channels: { artist: "artist" }}))
]
})
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