Public
Edited
Jun 12, 2023
Insert cell
Insert cell
Plot.plot({
marginBottom: 60,
marginLeft: 80,
marginRight: 60,
x: {
label: null,
},
marks: [
Plot.barY(alphabet, {fill: "#ddd", x: "letter", y: "frequency"}),
Plot.axisX({fill: "orange", stroke: "green", fontSize: 18, labelAnchor: "center", labelOffset: 45, label: "Letter"}),
Plot.axisY({fill: "blue", stroke: "red", fontSize: 18, labelAnchor: "center", label: "Frequency"}),
]
})
Insert cell
Insert cell
Plot.plot({
marginBottom: 60,
marginLeft: 80,
marginRight: 60,
x: {
label: null,
},
marks: [
Plot.barY(alphabet, {fill: "#ddd", x: "letter", y: "frequency"}),
Plot.axisX({fill: "orange", stroke: "green", fontSize: 18, labelAnchor: "center", labelOffset: 45, label: null}),
Plot.axisY({fill: "blue", stroke: "red", fontSize: 18, labelAnchor: "center", label: null}),
Plot.text(alphabet, Plot.selectFirst({fill: "brown", fontSize: 26, y: [0], text: ["Letter"], dx: 0, dy: 40})),
Plot.text(alphabet, Plot.selectFirst({fill: "pink", fontSize: 26, x: "", text: ["Frequency"], rotate: -90, dx: -550, dy: 0}))
]
})
Insert cell
Insert cell
Plot.plot({
marginBottom: 60,
marginLeft: 80,
marginRight: 60,
x: {
label: null,
},
marks: [
Plot.barY(alphabet, {fill: "#ddd", x: "letter", y: "frequency"}),
Plot.axisX({fill: "orange", stroke: "green", fontSize: 18, labelAnchor: "center", labelOffset: 45, label: null}),
Plot.axisX({fill: "red", ticks: [], fontSize: 18, labelAnchor: "center", labelArrow: false, labelOffset: 50, label: "Letters"}),
Plot.axisY({fill: "blue", stroke: "red", fontSize: 18, labelAnchor: "center", label: null}),
Plot.axisY({fill: "green", ticks: [], fontSize: 18, labelAnchor: "center", labelArrow: false, labelOffset: 75, label: "Frequency"}),
]
})

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