Public
Edited
Mar 21, 2023
viewof color = Inputs.color({ label: "Favorite color", value: "#4682b4" })
Plot.plot({
marks: [
Plot.barX(energy_2021, {
x: "quadrillion_btu",
y: "type",
fill: color,
stroke: "yellow",
sort: { y: "x", reverse: true }
}),
Plot.ruleX([0])
],
marginLeft: 150
})
us_energy.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
viewof pickLineWidth = Inputs.range([0, 10], {
label: "Choose line width",
step: 1
})
viewof minYear = Inputs.range([1973, 2021], { label: "min year", value: 1973 })
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(energy_production, {
x: "year",
y: "quadrillion_btu",
stroke: "type",
strokeWidth: pickLineWidth
})
],
color: { legend: true },
x: { domain: [minYear, 2022] }
})
power_plants
Plot.plot({
projection: "albers-usa",
marks: [
Plot.dot(us_plants, {
x: "longitude",
y: "latitude",
fill: "primary_source",
r: "total_capacity"
}),
Plot.geo(states)
],
r: { range: [0.5, 12] }
})
us_plants.map((d) => d.primary_source)
x = 6
x == 5 ? "YA" : "NO"
import {addTooltips} from "@mkfreeman/plot-tooltip"
energy_2021 = energy_production.filter(d => d.year == 2021)
import {power_plants} from "@observablehq/us-energy-mix-bubble-map-recreation"
import {states} from "@observablehq/us-energy-mix-bubble-map-recreation"
import {showMe} from "@observablehq/show-me"
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.
