Published unlisted
Edited
Aug 30, 2022
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.dot(selected, {x: x_axis, fill: fill})
],
color: {legend: true},
marginLeft: 80,
width: 1000
})

Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
vl
.markBar()
.encode(vl.y().fieldN("class"), vl.x().count())
.data(selected)
.render()
Insert cell
Histogram(selected, { value: (d) => +d["Actual Impact"] })
Insert cell
viewof n = Inputs.range([0, selected.length], {label: "Number of buttons to show", value: 5, step: 1})
Insert cell
html`
<h2>Names</h2>
${selected.slice(0, n).map((d) => html`<button>${d.name}</button>`)}
`
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
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