Public
Edited
Jun 10, 2023
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.frame({anchor: "left", strokeWidth: 2, stroke: "orange"}),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency"})
]
})
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.ruleX(["A"], { strokeWidth: 2, stroke: "green" }),
Plot.ruleX([0], { strokeWidth: 2, stroke: "blue" }),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency"})
]
})
Insert cell
Plot.plot({
marks: [
Plot.frame({anchor: "left", strokeWidth: 2, fill: "green", stroke: "pink"}),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency"})
]
})
Insert cell
Plot.plot({
marks: [
Plot.ruleX(["A"], { strokeWidth: 2, stroke: "green" }),
Plot.ruleX([0], { strokeWidth: 2, stroke: "blue" }),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y2"}})
]
})
Insert cell
Insert cell
Plot.plot({
y: {
line: true
},
marks: [
Plot.ruleX(["A"], { strokeWidth: 2, stroke: "green" }),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency"})
]
})
Insert cell
Plot.plot({
y: {
line: true
},
marks: [
Plot.ruleX(["A"], { strokeWidth: 2, stroke: "green" }),
Plot.ruleY([0], { strokeWidth: 2, stroke: "red" }),
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y2"}})
]
})
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