fix: adapt chart period label according to granularity

This commit is contained in:
Alexis Fourmaux 2026-05-12 19:51:50 +02:00
parent 28f49b5209
commit 0cb5706ed7
2 changed files with 14 additions and 6 deletions

View file

@ -1,7 +1,7 @@
function renderChart(points) {
function renderChart(points, granularity) {
const canvas = document.getElementById("consumption-chart");
const labels = points.map((p) => formatPeriod(p.period));
const labels = points.map((p) => formatPeriod(p.period, granularity));
const data = points.map((p) => p.delta_m3);
const style = getComputedStyle(document.documentElement);
@ -45,7 +45,15 @@ function renderChart(points) {
return chart;
}
function formatPeriod(isoString) {
const PERIOD_FORMATS = {
hour: { hour: "2-digit", minute: "2-digit", day: "2-digit", month: "short" },
day: { day: "2-digit", month: "short" },
week: { day: "2-digit", month: "short" },
month: { month: "short", year: "numeric" },
};
function formatPeriod(isoString, granularity) {
const date = new Date(isoString);
return date.toLocaleDateString("fr-FR", { day: "2-digit", month: "short" });
}
const opts = PERIOD_FORMATS[granularity] ?? PERIOD_FORMATS.day;
return date.toLocaleDateString("fr-FR", opts);
}