# Drill-down

> The overview shows that something is wrong; the viewer needs to get to what, in one click.

- Canonical: https://patterns.konigi.com/dashboards/drill-down
- Group: Interaction
- Level: flow
- Status: published
- Updated: September 10, 2026
- Also called: click through, expand to detail, navigate to scope

---

## Problem

The overview shows error rate climbing. The viewer now needs the specific service, the specific endpoint, and eventually the specific request, and at every step they must not lose the time range, the filters, or their place.

## Solution

Make every aggregate a doorway. A bar, a row, a cell, a node: clicking it opens the narrower view of the same thing, already scoped.

Shneiderman's mantra names this as one of the seven tasks and puts it in sequence: overview first, zoom and filter, then details on demand. Drill-down is the transition between those stages, and it is judged almost entirely on how much context survives the jump.

Grafana's data links show what "carrying context" concretely requires. A link can interpolate `__url_time_range` for the dashboard's current window, `__from` and `__to`, `__series.name`, `__field.name` and `__field.labels.<LABEL>`, and the value under the cursor as `__value.raw`, `__value.numeric`, `__value.text` or `__value.time`. That list is essentially an inventory of what the viewer had in their head at the moment they clicked. A drill-down that drops any of it makes them rebuild it by hand on arrival.

The most common failure is silent scope loss: clicking a spike on a chart filtered to one cluster lands on a page showing all clusters, at the default time range, and the number the viewer was chasing is no longer there. They usually assume they misread the first chart.

The second failure is the dead end. Somewhere down the chain there is a level with nothing below it, and if that level doesn't say so, viewers keep clicking and start distrusting the whole path.

## Use when

There is a genuine hierarchy—fleet to host, service to endpoint, issue to event—and the overview is a summary of things that individually exist somewhere.

## Don't use when

There is no level below. A click that reloads the same information in a modal teaches viewers that clicking does nothing. Also avoid it when the answer is better reached by filtering in place; jumping pages costs orientation that cross-filtering doesn't.

## Trade-offs

Every drill step is a context switch, and deep paths lose people. Back is the most-used control in this pattern and the most often broken, especially when the drill target is a different product. Links encode assumptions about the destination's URL structure, so they rot quietly when the other page changes. And drill-downs create an implicit hierarchy that may not be the only sensible one: a path from service to host cannot answer a question that starts at the host.

## Checklist

- Does the time range survive the jump?
- Do the active filters and template variables survive it?
- Does the value or series the viewer clicked arrive as scope on the other side?
- Is the target obviously the same thing, narrower—or does it look like a different page?
- Is it visually clear what is clickable before the cursor is over it?
- Does browser back return to the exact prior state, including scroll?
- What happens at the bottom of the hierarchy, and does the last level say it is the last?
- Does the destination handle an empty result, and does it say why?
- Does it open in place or a new tab, and is that consistent across the dashboard?
- Who owns the destination's URL contract, and what happens when it changes?

## Compare

**Grafana** makes the context explicit as interpolated variables, which is powerful and means a drill-down is only as good as the person who assembled the link string. **Sentry** builds the hierarchy into its object model—issue to event to trace to span—so drilling is navigation between things rather than between dashboards, and back always means something. **Datadog** ties panels to a scope inherited from the page, so a click carries tags rather than a hand-written URL, which rots less and constrains where you can go. **Honeycomb** largely replaces the pattern: rather than navigating to a narrower page you add a group-by or a filter to the query you already have, so there is no jump to lose context across.

## Related

Overview then detail is the structure this pattern moves through. Cross-filter is the alternative that narrows without navigating. Detail on demand is the in-place version for a single item. Trace waterfall is often the last stop on the path. Ranked list is the most common origin, because a rank position is a promise that the item exists.

## Examples

### Grafana (Grafana Labs)

The reference implementation for panel grids, template variables, and stat panels; most other tools are defined by how they differ from it.

**Examples / Alert List** — captured September 10, 2026, Grafana Play (signed out; no version string exposed). operational, medium density, dark theme, desktop-web.

Seven alerts, and the durations are the story. "Browser market share > 50%" has been firing for 17 days, 15 hours and 12 minutes. Two more have been firing for over three days. An alert that has been true for two and a half weeks is not telling anyone anything—it has become part of the background, and the list it sits in is now a list you scroll past. The other thing worth reading is the names. Six alerts, six conventions: a full sentence, a metric identifier in snake case, a camel-case service name, a two-word phrase, and two that just say "Dynamic". Somebody arriving at this list at three in the morning cannot tell from the names what is broken or how badly, which is work the naming could have done for free.

Hotspots in this capture:

- [Alert rule attached to panel](https://patterns.konigi.com/dashboards/alert-rule) — Seven rules in six naming conventions. Nothing in the list conveys severity or subject.
- [Alert rule attached to panel](https://patterns.konigi.com/dashboards/alert-rule) — Firing for 17 days. Still actionable, in principle; nobody has acted for two and a half weeks.
- [Semantic status color](https://patterns.konigi.com/dashboards/semantic-status-color) — Pending rather than firing: the threshold is met and the duration isn't. Two states, both named.
- [Filter bar](https://patterns.konigi.com/dashboards/filter-bar) — "1 instance, 24 hidden by filters"—the list saying what it is not showing you.
- [Drill-down](https://patterns.konigi.com/dashboards/drill-down) *(this pattern)* — The route from an alert back to the rule that defined it, on every row.

**Examples / Logs Panel** — captured September 10, 2026, Grafana Play (signed out; no version string exposed). operational, medium density, dark theme, desktop-web.

The arrangement is the standard one and it is right: a stacked volume chart by log level across the top, then the raw stream underneath, so the shape of the traffic and the individual lines share one page. Two details are worth stopping on. Every line carries two timestamps in two timezones—the gutter reads 2026-09-10 18:36:58.435 in the browser's local time, and the JSON three characters later reads 2026-09-11T01:36:58.434956621Z in UTC. Same instant, seven hours apart, on the same row, and nothing labels either one. The second is the trace ID in the expanded panel at the bottom, which is the thing that makes a log line usable: it is the route from a line of text to the request it came from. Two of the three entries shown carry the identical trace ID, which is also the case deduplication exists for.

Hotspots in this capture:

- [Stacked composition](https://patterns.konigi.com/dashboards/stacked-composition) — Volume by level over time. The bottom band sits on a flat baseline; the two above it are approximate.
- [Log tail](https://patterns.konigi.com/dashboards/log-tail) — Raw lines, truncated at the right edge, with two timestamps in two timezones on every row.
- [Drill-down](https://patterns.konigi.com/dashboards/drill-down) *(this pattern)* — The trace ID: the route out of the wall of text and into the request that produced it.

## Related patterns

- [Overview then detail](https://patterns.konigi.com/dashboards/overview-then-detail) — The viewer needs to start wide and end narrow without losing their place.
- [Cross-filter](https://patterns.konigi.com/dashboards/cross-filter) — Selecting something in one panel should narrow every other panel to it.
- [Detail on demand](https://patterns.konigi.com/dashboards/detail-on-demand) — A small panel needs to become a big one for a moment.
- [Trace waterfall](https://patterns.konigi.com/dashboards/trace-waterfall) — One request touched twenty services and the viewer needs to see where the time went.
- [Ranked list](https://patterns.konigi.com/dashboards/ranked-list) — The viewer needs to know which few items dominate, not the distribution of all of them.

## Sources

- [Shneiderman, The Eyes Have It—A Task by Data Type Taxonomy](https://www.cs.umd.edu/~ben/papers/Shneiderman1996eyes.pdf)
- [Grafana, Configure data links](https://grafana.com/docs/grafana/latest/panels-visualizations/configure-data-links/)
- [Bach et al., Dashboard Design Patterns](https://dashboarddesignpatterns.github.io/patterns.html)

---

Screenshots on patterns.konigi.com are reproduced for commentary and criticism.
Product names and marks belong to their owners.