ansprache_chart = Plot.plot({
height: 750,
width,
marginLeft: 100,
marginBottom: 40,
x: {
axis: "bottom",
tickFormat: "",
label: "",
ticks: [1970, 1980, 1990, 2000, 2010, 2020]
},
y: { axis: null, range: [60, -60] },
fy: { label: null, domain: ansprache.map((d) => d.wort) },
marks: [
d3
.groups(ansprache, (d) => d.wort)
.map(([, values]) => [
Plot.areaY(values, {
x: (d) => d.jahr,
y: "wert",
fy: "wort",
curve: "basis",
sort: "jahr",
fill: (d) =>
[
"Krise",
"Schwierigkeiten",
"Probleme",
"Soldaten",
"Leid",
"Gewalt",
"Sorgen"
].includes(d.wort)
? "#e84f1c"
: "#4f80ff",
fillOpacity: 0.4
}),
Plot.lineY(values, {
x: (d) => d.jahr,
y: "wert",
fy: "wort",
curve: "basis",
sort: "jahr",
strokeWidth: 1,
stroke: (d) =>
[
"Krise",
"Schwierigkeiten",
"Probleme",
"Soldaten",
"Leid",
"Gewalt",
"Sorgen"
].includes(d.wort)
? "#e84f1c"
: "#4f80ff",
strokeOpacity: 0.5
})
])
]
})
ansprache = FileAttachment("weihnachtsansprache_long@4.csv").csv({
typed: true
})
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.
