# Compare periods > Today's line means nothing without last week's line under it. - Canonical: https://patterns.konigi.com/dashboards/compare-periods - Group: Interaction - Level: flow - Status: published - Updated: September 10, 2026 - Also called: period over period, year over year, time shift --- ## Problem Traffic is down 30% this morning. That is either an incident or a Monday, and the current chart cannot tell the difference because it only shows now. ## Solution Draw the comparison period on the same axes. Same shape, same scale, offset in time, usually rendered ghosted or dashed so the current period stays dominant. The comparison base is the entire design decision, and there are only a few honest choices. **Immediately previous** period suits things without a cycle. Fine for a quarterly total, wrong for anything with a weekly rhythm, because yesterday was Sunday. **Same period last week** is the workhorse for anything human-driven, since it aligns day of week and time of day, which are the two strongest cycles in most product data. **Same period last year** aligns season and holiday, and misaligns day of week, which is why year-over-year charts have a characteristic weekly wobble that people mistake for signal. None of them handle moving holidays, and every one of them breaks in the week after a clock change. Grafana's implementation of this is time shift, applied per panel relative to the dashboard's range. That per-panel scoping is worth noticing, because it is also the trap: a dashboard where one panel is shifted and the others are not looks entirely normal and is comparing different things. The rendering matters more than it seems. Two lines of equal weight produce a chart where the viewer has to keep checking which is which. The comparison should be quieter than the present—thinner, dashed, greyed—so the current period reads first and the past reads as context. ## Use when The metric has a cycle, the audience needs to judge whether today is unusual, and a single number's delta is not enough because the shape matters. ## Don't use when The underlying population changed. Comparing this week against last week is meaningless if a marketing campaign doubled acquisition in between, and the chart will look like a product improvement. Also skip it where an anomaly band already encodes expected range more compactly. ## Trade-offs Every comparison doubles the ink on the chart and roughly doubles the query cost. The base period is a choice that is rarely displayed, so two people can read the same chart under different assumptions. Comparisons invite over-reading of small differences—a 4% gap against last Tuesday is usually noise, and drawn as two visibly separated lines it does not look like noise. And clock changes, leap days and moving holidays produce annual artefacts that get explained as business events. ## Checklist - What is the comparison base, and is it stated on the chart? - Does the base align day of week, or does it manufacture a weekly cycle? - Is the comparison rendered subordinate to the current period? - Is only some of the page shifted, and would anyone notice? - Did the underlying population change between the periods? - How are clock changes, leap days and moving holidays handled? - Is the difference also available as a number, not only as two lines? - Is a 4% gap distinguishable from normal variation, and does anything say so? - Does the comparison survive a time-range change, and does it rescale sensibly? - Would an anomaly band say the same thing with half the ink? ## Compare **Grafana** implements this as a per-panel time shift relative to the dashboard range, which is flexible and lets one panel silently compare a different window from its neighbours. **Plausible** and similar analytics tools make period comparison a page-level toggle, so every number and chart shifts together and the base is displayed once where it cannot be missed. **Datadog** offers explicit day-before, week-before and month-before overlays as graph options, naming the base in the UI rather than expressing it as an offset someone has to decode. **Amplitude** pushes past overlays into cohort comparison, which answers the population-changed objection this pattern otherwise has no response to. **Cloudflare Radar** draws the previous period as a dotted line on the same axis by default, with no control to turn it off. The comparison is how the chart is drawn rather than a feature a viewer has to find, which is the one arrangement where nobody forgets to switch it on. ## Related Delta indicator is this comparison reduced to a single badge, and inherits every base-period problem. Time-range picker sets the current window the comparison is relative to. Cohort grid is the rigorous answer when the population itself changes between periods. Anomaly band encodes "normal for this hour" more compactly. Time series is the chart both periods are drawn on. ## Examples ### Cloudflare Radar (Cloudflare) A public dashboard with no account, no filters worth the name, and an audience of journalists. Designed for people who will read one number and leave. **Worldwide Overview** — captured September 11, 2026, Public site, signed out; no version string exposed. public, medium density, light theme, desktop-web. Radar is a dashboard for people who did not come to use a dashboard. The audience is journalists, researchers and the merely curious, nobody has an account, and the design follows from that in two ways worth copying. Two controls scope the whole page—where, and when—and neither is a filter in the sense the rest of this gallery means it; the only other selector on the page sits inside the traffic panel. Everything else that looks like a control is a link. Each panel is a standing summary of a section that has its own full page behind the arrow in its heading, so the overview works as a table of contents rather than a filtered view of one dataset. And almost every value is printed as text above the chart that encodes it: "Bot 57.9%, Human 42.1%" sits over the bar rather than inside it. You can read the number without reading the chart, which is the right trade when most of your readers will take one figure and leave. Hotspots in this capture: - [Multi-page dashboard](https://patterns.konigi.com/dashboards/multi-page-dashboard) — Eleven sections behind one rail, with the open one expanded in place. Radar is a site of dashboards, not a dashboard. - [Compare periods](https://patterns.konigi.com/dashboards/compare-periods) *(this pattern)* — The dotted series is the previous seven days, drawn on the same axis rather than beside it. - [Overview then detail](https://patterns.konigi.com/dashboards/overview-then-detail) — Two summaries and an arrow each. The panel exists to tell you whether the full page is worth opening. - [Ratio and rate](https://patterns.konigi.com/dashboards/ratio-and-rate) — Shares only, never counts, and both sides of the split are named so the denominator is never in doubt. - [Stacked composition](https://patterns.konigi.com/dashboards/stacked-composition) — Four mitigation techniques to 100%. The bar is almost redundant next to the printed figures, which is the point. - [Ranked list](https://patterns.konigi.com/dashboards/ranked-list) — A top ten with no magnitudes at all. The rank is the whole finding. - [Delta indicator](https://patterns.konigi.com/dashboards/delta-indicator) — Eight shares with their change under them, all of them fractions of a point, which tells you how still this data is. ### Kibana (Elastic) Query-first rather than panel-first: the search bar is the primary control and the charts are downstream of it, which inverts Grafana's arrangement. **Dashboards / [Flights] Global Flight Dashboard** — captured September 10, 2026, Elastic demo environment, sample flight data (guest session). analytical, dense density, light theme, desktop-web. Two things on this page are worth arguing with. The first is the table on the right, sorted by delay rate: Chicago/Rockford 100%, Syracuse 100%, Birmingham 75%. A hundred percent of flights delayed is either a catastrophe or one flight, and nothing in the table says which, because the denominator isn't a column. The cells are on a red ramp, so the two rows that are almost certainly a sample of one are the loudest thing in the panel. The second is the tile row: Delayed 25.2%, then beside it "Delayed vs 1 week earlier—76.9%". Seventy-six point nine percent of what? It could be last week's rate, it could be this week as a proportion of last week, it could be the change. Three different numbers, one label, and the tile picks whichever the query returned. What the page gets right is the filtering: a KQL bar for people who know the syntax and three declared controls underneath for people who don't, both visible at once. Hotspots in this capture: - [Ratio and rate](https://patterns.konigi.com/dashboards/ratio-and-rate) — Delay rates up to 100% with no denominator anywhere. One flight and a thousand flights render identically. - [Compare periods](https://patterns.konigi.com/dashboards/compare-periods) *(this pattern)* — "vs 1 week earlier, 76.9%"—the comparison base is named and the expression isn't. - [Share and embed](https://patterns.konigi.com/dashboards/share-and-embed) — Share, export and full-screen in the header. Whether the range and filters travel with them is the whole question. - [Filter bar](https://patterns.konigi.com/dashboards/filter-bar) — Declared controls under the query bar: two pickers and a price range. Both mechanisms on screen at once. - [Panel grid](https://patterns.konigi.com/dashboards/panel-grid) — Twelve columns, and the biggest panel is a table rather than the headline chart. Size isn't carrying priority here. - [Stacked composition](https://patterns.konigi.com/dashboards/stacked-composition) — Stacked to 100%, so the total is discarded on purpose and only the mix of delay types remains. - [Annotation](https://patterns.konigi.com/dashboards/annotation) — Event markers along the top of the series, numbered and grouped, on the data's own axis. - [Header KPI strip](https://patterns.konigi.com/dashboards/header-kpi-strip) — Five tiles in three different sizes and two different layouts, so the row reads as five things. ### Netdata Per-second charts, hundreds per node, with a per-chart anomaly ribbon instead of a band on the series. **Metrics / System** — captured September 10, 2026, Netdata Agent v2.10.0-686-nightly (public registry node, signed out). operational, dense density, dark theme, desktop-web. Structurally the opposite of Grafana, and worth the comparison. Nobody built this page. The right rail says "showing 720 of total 720 charts" and the tree beneath it—System, Compute, Memory, Storage, Network, Hardware, Processes, then Apps, Users, Groups, O/S Services, and every application it found—is generated from what the agent collects. The canvas is the same hierarchy rendered downward, four levels deep, headings prefixed with dashes: System, then Compute, then CPU, then the chart. There is no editorial layer at all, which means nothing is missing and nothing is prioritised. The header also does something most products won't: it reports "Live 1, Stale 8" beside the node count, so eight of the nine machines behind this view are not currently reporting and the page says so rather than drawing their last known values. Hotspots in this capture: - [Sidebar and canvas](https://patterns.konigi.com/dashboards/sidebar-and-canvas) — The rail is the dashboard. A generated tree of every metric family the agent found. - [Search across panels](https://patterns.konigi.com/dashboards/search-across-panels) — 720 charts, so search is the navigation and the tree is the filing system nobody browses. - [Header KPI strip](https://patterns.konigi.com/dashboards/header-kpi-strip) — Twelve tiles in two rows, in four different layouts. It reads as twelve things rather than one strip. - [Gauge and dial](https://patterns.konigi.com/dashboards/gauge) — Arcs for disk reads and writes, where the maximum is invented—this is a rate, not a capacity. - [Semantic grouping](https://patterns.konigi.com/dashboards/semantic-grouping) — Sections generated by the collector rather than chosen. Consistent, and about nothing in particular. - [Freshness indicator](https://patterns.konigi.com/dashboards/freshness-indicator) — Live 1, Stale 8. Most products would have drawn all nine and said nothing. - [Dashboard builder](https://patterns.konigi.com/dashboards/dashboard-builder) — A query builder inline in the panel header: group by, aggregation, node and dimension count. - [Compare periods](https://patterns.konigi.com/dashboards/compare-periods) *(this pattern)* — Offered per chart rather than per dashboard, which is the scoping trap: one panel shifted, the rest not. ## Related patterns - [Delta indicator](https://patterns.konigi.com/dashboards/delta-indicator) — A number means nothing until the viewer knows which way it moved and by how much. - [Time-range picker](https://patterns.konigi.com/dashboards/time-range-picker) — Every question about a metric starts with 'over what window', and the control has to be fast for the common windows. - [Cohort grid](https://patterns.konigi.com/dashboards/cohort-grid) — Retention differs by when people arrived; the viewer needs cohorts side by side over time. - [Anomaly band](https://patterns.konigi.com/dashboards/anomaly-band) — A metric is moving, and the person watching it can't tell whether the movement is normal for this hour on this weekday or the start of an incident. - [Time series](https://patterns.konigi.com/dashboards/time-series) — The viewer needs to see how a value changed over time and spot the moment it changed. ## Sources - [Grafana, Use dashboards (time range and time shift)](https://grafana.com/docs/grafana/latest/visualizations/dashboards/use-dashboards/) - [Cohort analysis](https://en.wikipedia.org/wiki/Cohort_analysis) - [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.