Public
Edited
Mar 14, 2023
Insert cell
Insert cell
Inputs.table(cars)
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.dot(cars, {x: "power (hp)", y: "economy (mpg)", fill: "steelblue", title: "name"})
]
})
Insert cell
Plot.plot({
facet: {
data: cars,
x: "species"
},
marks: [
Plot.frame(),
Plot.dot(cars, {x: "power (hp)", y: "economy (mpg)"})
]
})
Insert cell
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true, limit: 5}}),
Plot.ruleY([0])
]
})
Insert cell
viewof table1 = Inputs.table(olympians)
Insert cell
Plot.plot({
marks: [
Plot.barX(olympians, Plot.groupY({x: "count"}, {y: "nationality", sort: {y: "x", reverse: true, limit: 10}})),
Plot.ruleX([0])
]
})
Insert cell
DonutChart(islands, {name: d=>d.name, value: d=>d.value, innerRadius: 80})
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(aapl, {x: "Date", y: "Close"})
]
})
Insert cell
Plot.plot({
marks: [
Plot.lineY(aapl, {x: "Date", y: "Close", stroke: "steelblue"})
],
// width: 200,
})
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