feat: tijdlabels op hele uren in plaats van de ruwe meettijden

De labels toonden de werkelijke meettijdstippen van Netatmo (11:41,
17:41, 23:41), wat onrustig leest. Nu markeringen op hele uren die op de
klok zijn uitgelijnd: elke 6 uur vanaf middernacht, dus 00:00, 06:00,
12:00, 18:00, elk op zijn echte tijdspositie in het venster. "nu" blijft
op de rechterrand; een markering die daar te dicht bij komt valt weg.

axisMarks() is vervangen door hourTicks(), die uur voor uur door het
venster loopt en telkens de lokale klok raadpleegt. Daardoor blijven de
labels ook op de zomertijdwissel hele lokale uren, waar optellen in vaste
stappen er een uur naast zou zitten; daar is een test voor. Een label
vlak op de linkerrand wordt niet gecentreerd, zodat het binnen de
grafiek blijft. Servicewerker naar v9.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

public/app.js

@@ -2,7 +2,7 @@ import {
   f1, fInt, fmm, markerPos, barHeights, wmoIcon, trendLabel,
   formatDate, formatTime, dayAbbr, monthName, isOlderThan, msUntil,
   co2Level, fPct, fHpa, seriesRange, sparklinePath,
-  windArrowDeg, fKmh, formatHour, formatFullDate, pinRoom, axisMarks,
+  windArrowDeg, fKmh, formatHour, formatFullDate, pinRoom, hourTicks,
 } from './format.js';
 import { icon, windArrow } from './icons.js';
 
@@ -111,14 +111,18 @@ function renderPressure(p) {
   setText('press-min', range ? String(Math.round(range.min)) : '–');
   $('press-path').setAttribute('d', sparklinePath(values, 560, 56));
 
-  // Tijdlabels op dezelfde posities als de punten waar ze bij horen; de laatste is "nu".
-  const marks = axisMarks(p.history.length);
-  $('press-hours').innerHTML = marks.map((m, i) => {
-    const last = i === marks.length - 1;
-    const label = last ? 'nu' : formatTime(p.history[m.index].at, state.tz);
-    const style = i === 0 ? 'left:0' : last ? 'right:0' : `left:${m.percent}%;transform:translateX(-50%)`;
-    return `<span style="${style}">${label}</span>`;
-  }).join('');
+  // Hele uren op hun echte tijdspositie, plus "nu" op de rechterrand.
+  const first = p.history[0];
+  const last = p.history[p.history.length - 1];
+  const ticks = first && last ? hourTicks(first.at, last.at, state.tz) : [];
+  $('press-hours').innerHTML = ticks
+    .map((t) => {
+      // Een markering vlak op de linkerrand niet centreren, anders steekt het label buiten de grafiek.
+      const style = t.percent < 3 ? 'left:0' : `left:${t.percent.toFixed(1)}%;transform:translateX(-50%)`;
+      return `<span style="${style}">${formatTime(t.at, state.tz)}</span>`;
+    })
+    .concat(last ? ['<span style="right:0">nu</span>'] : [])
+    .join('');
 }
 
 function renderForecast(days) {