Stacked Area Chart (Vega-Lite)
Composition over time as a stacked area chart.
Rendering…
Make it your own.
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"data": {
"values": [
{"month": "Jan", "source": "Organic", "v": 120}, {"month": "Jan", "source": "Paid", "v": 60}, {"month": "Jan", "source": "Referral", "v": 30},
{"month": "Feb", "source": "Organic", "v": 150}, {"month": "Feb", "source": "Paid", "v": 80}, {"month": "Feb", "source": "Referral", "v": 40},
{"month": "Mar", "source": "Organic", "v": 200}, {"month": "Mar", "source": "Paid", "v": 90}, {"month": "Mar", "source": "Referral", "v": 55}
]
},
"mark": "area",
"encoding": {
"x": {"field": "month", "type": "ordinal", "sort": null, "title": null},
"y": {"field": "v", "type": "quantitative", "stack": "zero", "title": "Signups"},
"color": {"field": "source", "type": "nominal", "title": "Source"}
}
}