gm
Type Table, then Shift-Enter. Ctrl-space for more options.
gm
X
mean
lifeExp
Y
continent
Color
continent
Size
—
Facet X
—
Facet Y
—
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(aapl, {x: "Date", y: "Close"})
]
})
Plot.plot({
marginRight: 12,
marginLeft: 64,
color: { legend: true },
marks: [
Plot.barX(
gm,
Plot.groupY(
{ x: "mean" },
{ x: "lifeExp", y: "continent", fill: "continent", tip: true }
)
),
Plot.ruleX([0])
]
})
europe
X
pop
Y
country
Color
—
Size
—
Facet X
—
Facet Y
—
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.
data1
Type Table, then Shift-Enter. Ctrl-space for more options.
data1
X
continent
Y
count
—
Color
—
Size
—
Facet X
—
Facet Y
—
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
marginTop: 20,
marginRight: 8,
marginLeft: 87,
marks: [
Plot.barY(
data1,
Plot.groupX({ y: "mean" }, { x: "continent", y: "lifeExp", tip: true })
),
Plot.ruleY([0])
]
})
Plot.plot({
// width,
// marginTop: 20,
// marginRight: 8,
marginLeft: 87,
marks: [
Plot.barY(
data1,
Plot.groupX({ y: "sum" }, { x: "continent", y: "pop", tip: true })
),
Plot.ruleY([0])
]
})
Plot.plot({
marks: [
Plot.barY(
data1,
Plot.groupX({ y: "count" }, { x: "continent", tip: true })
),
Plot.ruleY([0])
]
})
Plot.plot({
x: {label: null, tickPadding: 6, tickSize: 0},
y: {percent: true},
marks: [
Plot.ruleX(alphabet, {x: "letter", y: "frequency", strokeWidth: 2}),
Plot.dot(alphabet, {x: "letter", y: "frequency", fill: "currentColor", r: 4})
]
})
Plot.plot({
marginLeft: 47,
marks: [
Plot.dot(
data1,
Plot.groupX({ y: "mean" }, { x: "continent", y: "gdpPercap", tip: true })
)
]
})
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.
