From 7f402fcade5b3ee00070afa6501694ba0557bbc4c4162235929922e66d7492d5 Mon Sep 17 00:00:00 2001 From: Terrence Ezrol Date: Sun, 13 Jul 2025 14:17:08 -0400 Subject: [PATCH] fix range of graph --- src/tempgraph.ts | 25 +++++++++++++++++-------- 1 file changed, 17 insertions(+), 8 deletions(-) diff --git a/src/tempgraph.ts b/src/tempgraph.ts index e913b83..27c8ccb 100644 --- a/src/tempgraph.ts +++ b/src/tempgraph.ts @@ -39,6 +39,11 @@ export function loadGraph(dataArray?: string[]): void { return { time, event, temp }; }); + // Compute dynamic max time based on all entries + const maxEventTime = data.reduce((max, entry) => { + return entry.time ? Math.max(max, parseTime(entry.time)) : max; + }, 0); + const tempData = data .filter(entry => entry.event === 'Temp') .map(entry => { @@ -47,6 +52,10 @@ export function loadGraph(dataArray?: string[]): void { return { x: timeInSeconds, y: temp }; }); + // Extend tempData to ensure final Drop timestamp is visible + const lastTemp = tempData[tempData.length - 1]; + const extendedTempData = lastTemp ? tempData.concat({ x: maxEventTime, y: lastTemp.y }) : tempData; + const ctx = document.getElementById('myChart') as HTMLCanvasElement; ctx.width = 800; ctx.height = 400; @@ -65,9 +74,9 @@ export function loadGraph(dataArray?: string[]): void { label: { content: entry.event, display: true, - rotation: -90, // rotates text counter-clockwise - position: 'end', // anchors label near bottom of chart - yAdjust: -10, // nudges it downward (positive = down) + rotation: -90, + position: 'end', + yAdjust: -10, font: { size: 10 } @@ -75,7 +84,7 @@ export function loadGraph(dataArray?: string[]): void { }; }); - // Clean up previous chart if it exists + // Clean up previous chart instance if exists if (chartInstance) { chartInstance.destroy(); } @@ -85,7 +94,7 @@ export function loadGraph(dataArray?: string[]): void { data: { datasets: [{ label: 'Temperature (°C)', - data: tempData, + data: extendedTempData, borderColor: 'blue', fill: false, pointRadius: 5, @@ -101,15 +110,15 @@ export function loadGraph(dataArray?: string[]): void { x: { type: 'linear', position: 'bottom', + min: 0, + max: maxEventTime, ticks: { callback: function (value) { const mins = Math.floor(Number(value) / 60); const secs = Number(value) % 60; return `${mins}:${secs.toString().padStart(2, '0')}`; } - }, - min: 0, - max: 31 + } }, y: { title: {