Vega in the real world

The bridge between a real data source and a self-contained dataviz: turning an Elasticsearch/Kibana aggregation response, a trade log, or an observability stream into a Vega-Lite spec that renders on its own. Faithful mapping of real-world data shapes (nested buckets, percentiles, moving_fn) and complete business recipes — underwater drawdown, high-water mark, SLO burn-rate — that you won't find in the official docs.

20 featured snippets

• →Multiple series: sub-aggregation + flatten transformThe essential pattern for working with an ES sub-aggregation (date_histogram → terms): flatten the nested buckets with flatten, then pull out key and value with calculate. Buckets are provided inline in the ES response format.
• →P50/P95/P99 latencies: percentiles aggregation + foldPull the percentiles straight from the Elasticsearch response format (the lat.values object), then reshape to long format with fold to draw one line per percentile — sample data inline.
• →Server-side smoothing: moving_fn pipelineA moving average computed Elasticsearch-style with the moving_fn pipeline, overlaid on the raw metric: the spec reads the avg_lat.value and smooth.value objects from each bucket — sample data inline.
• →Scatter over raw documents (hits.hits)Reading the source documents instead of aggregations: each row mirrors an ES hit and the fields are pulled from _source with calculate — sample documents inline.
• →Rate of change: derivative pipelineThe change in volume between consecutive buckets, computed Elasticsearch-style with the derivative pipeline (the deriv.value object, null on the first bucket), colored by sign — sample buckets inline.
• →Pivot: from long format to wideThe inverse of fold: pivot creates one column per category, which lets you compute a ratio between two series that were originally stacked as rows.
• →Dynamic Top N: window rank + filterRank with window rank, then filter on the rank — the clean pattern for keeping only the top N categories, whatever the dataset.
• →Pareto chart (bars + cumulative %)Bars sorted in descending order plus a cumulative-percentage curve on the right axis, computed with window + joinaggregate — the classic 80/20 tool.
• →Candlestick chart (OHLC)A low→high rule for the wicks and an open→close bar for the bodies, colored by the candle's direction — a complete price chart in two layers.
• →Automatically label the maximum pointjoinaggregate brings in the global max, a filter isolates the matching row, and a point + text layer highlights it — the annotation follows the data.
• →End-of-line labels (replacing the legend)A reversed window rank on the date isolates the last point of each series to hang its name on — the legend disappears and the chart reads directly.
• →Waterfall: breaking down monthly P&LEach bar floats between a precomputed start and end (y/y2), colored as an increase, a decrease, or a total — the classic accounting bridge between two balances.
• →Approximated radar: profile of two strategiesVega-Lite has no radar mark: project each score into polar coordinates with calculate (cos/sin), then close the polygon with interpolate linear-closed.
• →Funnel: attrition across a data pipelineA funnel built from centered bars: calculate derives -volume/2 and +volume/2 as x/x2, and a text layer shows the volumes at the center of each stage.
• →Underwater drawdown: depth below the peakThe classic trading underwater curve: a red gradient area shows the distance from the equity peak, with a dashed rule and label anchored on the maximum drawdown.
• →Equity curve and high-water markThe cyan line tracks the account's equity; the gray step line traces the running high computed with a cumulative window max — the gap between the two reads at a glance.
• →Rolling win rate over 20 tradesA window mean turns the binary win/loss series into a rolling win rate: the curve only starts once the window is full (filter) and is compared against the 50% rule.
• →MAE vs MFE: trade execution qualityEach point compares a trade's maximum adverse excursion (MAE) against its maximum favorable excursion (MFE), colored by outcome — a high MFE among the losers points to poorly placed exits.
• →5 × 8 waffle: distribution of trade outcomesForty squares, one per trade: the calculate transforms (modulo and integer division) build the grid, and the semantic color counts winners, losers, and break-evens.
• →SLO burn rate: 1 h and 6 h windowsBoth windows of multi-window burn rate alerting (SRE workbook) on a single chart, each compared against its critical threshold via labeled dashed rules.