fix range of graph

This commit is contained in:
2025-07-13 14:17:08 -04:00
parent 6d0d27511f
commit 7f402fcade

View File

@@ -39,6 +39,11 @@ export function loadGraph(dataArray?: string[]): void {
return { time, event, temp }; 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 const tempData = data
.filter(entry => entry.event === 'Temp') .filter(entry => entry.event === 'Temp')
.map(entry => { .map(entry => {
@@ -47,6 +52,10 @@ export function loadGraph(dataArray?: string[]): void {
return { x: timeInSeconds, y: temp }; 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; const ctx = document.getElementById('myChart') as HTMLCanvasElement;
ctx.width = 800; ctx.width = 800;
ctx.height = 400; ctx.height = 400;
@@ -65,9 +74,9 @@ export function loadGraph(dataArray?: string[]): void {
label: { label: {
content: entry.event, content: entry.event,
display: true, display: true,
rotation: -90, // rotates text counter-clockwise rotation: -90,
position: 'end', // anchors label near bottom of chart position: 'end',
yAdjust: -10, // nudges it downward (positive = down) yAdjust: -10,
font: { font: {
size: 10 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) { if (chartInstance) {
chartInstance.destroy(); chartInstance.destroy();
} }
@@ -85,7 +94,7 @@ export function loadGraph(dataArray?: string[]): void {
data: { data: {
datasets: [{ datasets: [{
label: 'Temperature (°C)', label: 'Temperature (°C)',
data: tempData, data: extendedTempData,
borderColor: 'blue', borderColor: 'blue',
fill: false, fill: false,
pointRadius: 5, pointRadius: 5,
@@ -101,15 +110,15 @@ export function loadGraph(dataArray?: string[]): void {
x: { x: {
type: 'linear', type: 'linear',
position: 'bottom', position: 'bottom',
min: 0,
max: maxEventTime,
ticks: { ticks: {
callback: function (value) { callback: function (value) {
const mins = Math.floor(Number(value) / 60); const mins = Math.floor(Number(value) / 60);
const secs = Number(value) % 60; const secs = Number(value) % 60;
return `${mins}:${secs.toString().padStart(2, '0')}`; return `${mins}:${secs.toString().padStart(2, '0')}`;
} }
}, }
min: 0,
max: 31
}, },
y: { y: {
title: { title: {