Public
Edited
Apr 3
Insert cell
Insert cell
data = [
{lb: 0, lq: 1, med: 2, uq: 3, ub: 4, outliers: [-1, 10]},
{lb: 1, lq: 2, med: 3, uq: 6, ub: 7, outliers: [-2, 8, 9]},
]


Insert cell
Plot.plot({
marks: [
// Rule for lower to upper bounds (not including outliers)
Plot.ruleY(data,{x1: "lb", x2: "ub", y: (d, i) => i}),
// Bar for IQR or whatever
Plot.barX(data, {x1: "lq", x2: "uq", y: (d, i) => i, fill: "#888"}),
// Tick for median
Plot.tickX(data, {x: "med", y: (d, i) => i}),
// Dots for outliers, did a bit of unpacking here.
Plot.dot(data.map((d, i) => d.outliers.map(o => [i, o])).flat(), {x: d => d[1], y: d => d[0]}),
// Grid
Plot.gridX()
],
y: {type: "band"},
height: 200
})
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