Public
Edited
Mar 14, 2023
Insert cell
Insert cell
Insert cell
viewof inset = Inputs.range([-2, 14], {label: "Amount", step: 1, value: 1})
Insert cell
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true}, insetLeft: inset, insetRight: inset}),
Plot.ruleY([0])
]
})
Insert cell
Insert cell
Insert cell
viewof index = Inputs.range([0, 25], {label: "Which letter?", step: 1, value: 6})
Insert cell
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency",
sort: {x: "y", reverse: true},
fill: (d, i) => i === index ? "orange" : "lightgray"
}),
Plot.ruleY([0])
]
})
Insert cell
Insert cell
Insert cell
Insert cell
sankey
Insert cell
Insert cell
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true}}),
Plot.ruleY([1 / 26], {stroke: "orange"}),
Plot.ruleY([0])
]
})
Insert cell
Plot.plot({
y: {
grid: true
},
marks: [
Plot.barY([1/26], {fill: "orange", fillOpacity: 0.4}),
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true}}),
// Plot.ruleY([1 / 26], {stroke: "orange"}),
Plot.ruleY([0])
]
})
Insert cell
Insert cell
Plot.plot({
y: {
grid: true,
label: "↑ Unemployment (%)"
},
marks: [
Plot.ruleY([0]),
Plot.line(bls, {x: "date", y: "unemployment", z: "division", stroke: "lightgray", title: "division"}),
// Plot.line(metro, {x: "date", y: "unemployment", z: "division", stroke: "black"}),
Plot.line(bls, Plot.groupX({y: "mean"}, {x: "date", y: "unemployment", stroke: "steelblue"}))
]
})
Insert cell
Insert cell
viewof k = Inputs.range([1, 20], {label: "Smoothing", step: 1, value: 1})
Insert cell
Plot.plot({
marks: [
// Plot.ruleY([0]),
Plot.lineY(power_vs_temperature,
Plot.windowY({x: "date", y: "temperature",
k: k, // how many values to average
reduce: "mean", // how to shrink the values
stroke: "city"
}))
],
color: {
domain: ["Seattle", "Los Angeles"],
legend: true
},
marginLeft: 50
})
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