// Line & area charts: multi-series with markers, a smooth curve, a step curve,
// and stacked areas.
|grid| { columns: repeat(2); gap: 24; } [
|chart| "Latency (ms)" { categories: "p50" "p90" "p99" "p999"; } [
|line| "v1" {
data: 15 70 150 480; marker: circle; tags: "Low" "medium" "High" "Max";
}
|line| "v2" {
data: 12 40 100 300; stroke-style: dashed; marker: circle; tags: "Low" "medium" "High" "Max";
}
|line| "Speed" {
data: 290 160 70 40; stroke-style: dotted; marker: circle; tags: "Cool" "Warm" "Hot" ""; fill: --purple;
}
]
|chart| "Temperature (°C)" { categories: "6h" "9h" "12h" "15h" "18h" "21h"; } [
|line| "outdoor" { data: 8 12 19 22 17 11; curve: smooth; marker: dot; }
]
|chart| "Tier price ($)" { categories: "0" "10" "20" "30"; } [
|line| { data: 5 5 12 12; curve: step; }
]
|chart| "Signups" { categories: "Jan" "Feb" "Mar" "Apr" "May"; } [
|area| "free" { data: 30 45 60 55 80; }
|area| "paid" { data: 10 18 22 30 38; }
]
]