Applies the compare screen's chart-truthfulness rules (spec §8.1) to the
school detail page's time-series charts.
PerformanceChart (Results Over Time, both phases):
- Fill every academic year between the first and last data point via the
shared fillAcademicYears helper, so cancelled/unpublished years (2019/20,
2020/21, and — for KS2 — 2021/22) render as real gaps instead of
compressed time. Each series and the England overlay map onto this filled
axis with null for missing years; spanGaps:false so school lines never
bridge a gap.
- Replace the primary-only COVID note with a distinct, honest gap caption:
KS2 names the cancelled tests plus the unpublished 2021/22 school-level
year; KS4 names the unpublished 2019/20–2020/21 GCSE grading years.
- Mobile x-axis switches to autoSkip so the longer (gap-honest) axis stays
readable; the broken line still marks a missing year even when its tick
label is skipped.
AdmissionsTrendChart:
- Same gap-honest axis + spanGaps:false so a missing admissions year is a
real gap, not compressed time.
Point 12 (definite canvas heights): desktop is already a definite 280px;
fix the secondary detail's mobile .chartContainer, which fixed the outer
box at 220px and double-constrained PerformanceChart's own 220px canvas +
chip strip (clipping the chips onto the plot) — now height:auto to match
the primary view.
SatsChart is out of scope (single-year per-subject CSS bars — no year axis,
no canvas height to constrain).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0146VHeLAWjDVE2B5uU67jCB
A first-choice offer rate sitting on the y-max ceiling (100%) was drawn
flush against the top of the plot area, clipping the point marker. Add 8px
top layout padding and clip:false so ceiling values render in full, without
introducing a misleading >100% tick.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The hand-rolled SVG sparkline used px font sizes inside a 520-wide viewBox
that stretched to the full card width, so labels ballooned ~4x and collided —
and with 10+ years of real data the per-point labels and year ticks
overlapped badly, while the oversized chart stretched the "this year" view.
Replace it with a Chart.js line chart (AdmissionsTrendChart) in a fixed
200px wrapper, matching PerformanceChart: responsive px fonts, auto-skipping
x ticks, auto-scaled y-axis clamped to 0-100, emphasised latest point.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>