Plot.barY(
data,
Plot.groupX(
{ y: (series) => new d3.InternSet(series).size },
{
x: "island",
y: "species"
}
)
).plot({
height: 200,
width: 190,
y: { ticks: 2 }
})
Plot.barY(
data,
Plot.groupX(
{ y: (series) => new d3.InternSet(series).size },
{
x: "island",
y: "species",
fill: "species"
}
)
).plot({
height: 100,
width: 190,
y: { ticks: 2 }
})
Plot.barY(
data,
Plot.groupX(
{ y: (series) => new d3.InternSet(series).size },
{
x: "island",
y: "species",
fill: "species",
stroke: "sex",
strokeWidth: 8,
inset: 5,
z: (d) => `${d.species} - ${d.sex}` // here a series is a unique combination of (species, sex)
}
)
).plot({
color: { scheme: "turbo" },
height: 200,
width: 190,
y: { ticks: 5 }
})
import { data } from "@observablehq/plot-exploration-penguins"
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.
