workbook = FileAttachment("Growth Rates of Key Variables@7.xlsx").xlsx()
workbook.sheetNames
data = workbook.sheet(0, {
headers: true
})
data
Type Table, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
width: Math.max(width, 550),
marginLeft: 50,
color: { domain: keys, scheme: "Warm", legend: true },
facet: { data: data, x: "Growth Rates (% per year)" },
y: { tickFormat: "s", grid: true },
x: { axis: null, domain: keys },
marks: [
Plot.text([{}], {
text: () => " Growth Rates of Key Variables; the Gilded Age, the Progressive Era, and the Contemporary Era",
frameAnchor: "top",
anchor: "middle",
dy: -20,
fx: ["Real GDP per Capita"],
fontSize: 13,
fontWeight: "bold"
}),
Plot.ruleX(data, {
x: "ERA",
y: "Percent Change per Year",
stroke: "ERA",
strokeWidth: 3
}),
Plot.dot(data, {
x: "ERA",
y: "Percent Change per Year",
fill: "ERA",
r: 5,
}),
Plot.text(data, {
filter: (d) => d['Percent Change per Year'] > 0,
x: "ERA",
y: "Percent Change per Year",
text: (d) => d['Percent Change per Year'],
dy: -6,
lineAnchor: "bottom",
}),
Plot.text(data, {
filter: (d) => d['Percent Change per Year'] <= 0,
x: "ERA",
y: "Percent Change per Year",
text: (d) => d['Percent Change per Year'],
dy: 13,
lineAnchor: "bottom"
}),
Plot.axisFx({label: null, lineWidth: 5, marginBottom: 50, anchor: "bottom"}),
Plot.ruleY([0]),
Plot.ruleY([-2])
]
})
keys = d3.sort(new Set(data.map(d => d.ERA)), d => parseInt(d.match(/\d+/)[0]))
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.
