Published unlisted
Edited
Aug 20, 2021
Insert cell
Insert cell
Plot.plot({
grid: true,
facet: {
data: data,
y: "species"
},
marks: [
Plot.dot(data, { x: "flipper_length_mm", y: "body_mass_g", stroke: "sex" }),
Plot.text(
data,
Plot.selectFirst({
x: (d) => labels.get(d.species).x,
y: (d) => labels.get(d.species).y,
text: (d) => labels.get(d.species).text
})
)
]
})
Insert cell
labels = new Map([
["Adelie", { species: "Adelie", x: 300, y: 5000, text: "test Adelie" }],
["Gentoo", { species: "Gentoc", x: 250, y: 5000, text: "test Gentoc" }],
["Chinstrap", { species: "Chinstrap", x: 180, y: 5000, text: "test Chinstrap" }]
])
Insert cell
data = FileAttachment("penguins.csv").csv({typed: true})
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