Published
Edited
Jun 26, 2021
1 star
Insert cell
Insert cell

// Friends Kaggle https://www.kaggle.com/rezaghari/friends-series-dataset
friends = FileAttachment("friends@4.csv").csv({typed: true})

Insert cell
Plot.plot({
height: 640,
padding: 0.05,
grid: true,
x: {
axis: "top",
label: "Season"
},
y: {
label: "Episode"
},
color: {
scheme: "PiYG"
},
marks: [
Plot.cell(friends, {
x: "season",
y: "number_in_season",
fill: "imdb_rating",
// rx: 20 // uncomment for circles
}),
Plot.text(friends, {
x: "season",
y: "number_in_season",
text: d => d.imdb_rating?.toFixed(1),
title: "title"
})
]
})
Insert cell
Insert cell
Plot.plot({
x: {
round: false,
ticks: friends.filter(d => d.number_in_season === 1).map(d => d.id),
tickFormat: i => friends.find(d => d.id === i).season,
label: "Season →",
labelAnchor: "right"
},
color: {
scheme: "PiYG"
},
marks: [
Plot.cell(friends, {x: "id", fill: "imdb_rating"})
]
})
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