From 8f6a22d0c336259c668a542f23db883de5cac64f Mon Sep 17 00:00:00 2001 From: ISA Date: Thu, 20 Feb 2025 15:01:55 +0100 Subject: [PATCH] fix: DIA0, DIA1 und DIA2 werden alle drei Linien angezeigt --- .../LoopMeasurementChart.tsx | 64 ++++++++++++++++--- config/webVersion.ts | 2 +- 2 files changed, 55 insertions(+), 11 deletions(-) diff --git a/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx b/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx index 2f1d358..0f4886d 100644 --- a/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx +++ b/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx @@ -8,7 +8,7 @@ const LoopMeasurementChart = () => { const chartRef = useRef(null); const chartInstance = useRef(null); - // Daten aus dem Redux-Store abrufen + // Daten aus Redux abrufen const chartData = useSelector( (state: { chartData: { data: any[] } }) => state.chartData.data @@ -26,12 +26,15 @@ const LoopMeasurementChart = () => { chartInstance.current.destroy(); } + console.log("Chart Data:", chartData); + // Datenvorbereitung: Konvertieren der Zeitstempel in Millisekunden const processedData = chartData.map((entry) => ({ ...entry, timestampMs: new Date(entry.t).getTime(), })); + // Basis-Datasets für i und a (immer vorhanden) const datasets = [ { label: "Messwert Minimum (kOhm)", @@ -53,20 +56,56 @@ const LoopMeasurementChart = () => { backgroundColor: "rgba(192, 75, 75, 0.2)", fill: true, }, - { - label: - selectedMode === "DIA0" - ? "Messwert Mittelwert (m)" - : "Messwert Durchschnitt (g)", + ]; + + // Falls `m` vorhanden ist (DIA0), wird es gezeichnet + if ( + selectedMode === "DIA0" && + processedData.some((entry) => entry.m !== undefined) + ) { + datasets.push({ + label: "Messwert Mittelwert (m)", data: processedData.map((entry) => ({ x: entry.timestampMs, - y: selectedMode === "DIA0" ? entry.m : entry.g, + y: entry.m ?? NaN, // Falls `m` nicht existiert, wird `NaN` gesetzt })), - borderColor: "rgba(75, 75, 192, 1)", + borderColor: "rgba(255, 165, 0, 1)", // Orange + backgroundColor: "rgba(255, 165, 0, 0.2)", + fill: true, + }); + } + + // Falls `g` vorhanden ist (DIA1/DIA2), wird es gezeichnet + if ( + selectedMode !== "DIA1" && + processedData.some((entry) => entry.g !== undefined) + ) { + datasets.push({ + label: "Messwert Durchschnitt (g)", + data: processedData.map((entry) => ({ + x: entry.timestampMs, + y: entry.g ?? NaN, // Falls `g` nicht existiert, wird `NaN` gesetzt + })), + borderColor: "rgba(75, 75, 192, 1)", // Blau backgroundColor: "rgba(75, 75, 192, 0.2)", fill: true, - }, - ]; + }); + } + if ( + selectedMode !== "DIA2" && + processedData.some((entry) => entry.g !== undefined) + ) { + datasets.push({ + label: "Messwert Durchschnitt (g)", + data: processedData.map((entry) => ({ + x: entry.timestampMs, + y: entry.g ?? NaN, // Falls `g` nicht existiert, wird `NaN` gesetzt + })), + borderColor: "rgba(75, 75, 192, 1)", // Blau + backgroundColor: "rgba(75, 75, 192, 0.2)", + fill: true, + }); + } const ctx = chartRef.current.getContext("2d"); if (ctx) { @@ -76,6 +115,11 @@ const LoopMeasurementChart = () => { options: { responsive: true, maintainAspectRatio: false, + elements: { + line: { + spanGaps: true, // Ermöglicht das Zeichnen von Lücken + }, + }, scales: { x: { type: "time", diff --git a/config/webVersion.ts b/config/webVersion.ts index 8e5ae5b..401cb3f 100644 --- a/config/webVersion.ts +++ b/config/webVersion.ts @@ -6,5 +6,5 @@ 2: Patch oder Hotfix (Bugfixes oder kleine Änderungen). */ -const webVersion = "1.6.68"; +const webVersion = "1.6.69"; export default webVersion;