Public
Edited
Sep 14, 2022
1 star
chart1 = Plot.plot({
width,
marginLeft: 70,
marks: [
Plot.rectY(data, {
x: "year",
y: "revenue",
fill: "format",
order: [...colors.keys()],
reverse: true,
interval: d3.utcYear
})
],
color: { domain: [...colors.keys()], range: [...colors.values()] }
})
chart1.legend("color")
import { riaa } from "@observablehq/plot-test-data"
import { colors } from "@mbostock/revenue-by-music-format-1973-2018"
data = riaa.data
Plot.plot({
width,
marginLeft: 70,
facet: { data, x: "year" },
fx: { tickFormat: (d) => ("" + d.getUTCFullYear()).slice(2) },
marks: [
Plot.barY(data, {
y: "revenue",
fill: "format",
order: [...colors.keys()],
reverse: true
})
],
color: chart1.scale("color")
})
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.
