From e9bd0856c340df7db55d2b0c20949b3b13cf5269 Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 21 Feb 2025 06:44:22 +0100 Subject: [PATCH] Dezimalstellen in den Tooltips von Chart.js anzeigen --- .../LoopMeasurementChart.tsx | 42 +++++++++++++++---- config/webVersion.ts | 2 +- 2 files changed, 34 insertions(+), 10 deletions(-) diff --git a/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx b/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx index 213c6f5..cc59b86 100644 --- a/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx +++ b/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx @@ -64,7 +64,7 @@ const LoopMeasurementChart = () => { processedData.some((entry) => entry.m !== undefined) ) { datasets.push({ - label: "Messwert Mittelwert (m)", + label: "Messwert Mittelwert", data: processedData.map((entry) => ({ x: entry.timestampMs, y: entry.m ?? NaN, // Falls `m` nicht existiert, wird `NaN` gesetzt @@ -81,7 +81,7 @@ const LoopMeasurementChart = () => { processedData.some((entry) => entry.g !== undefined) ) { datasets.push({ - label: "Messwert Durchschnitt (g)", + label: "Messwert Durchschnitt", data: processedData.map((entry) => ({ x: entry.timestampMs, y: entry.g ?? NaN, // Falls `g` nicht existiert, wird `NaN` gesetzt @@ -123,12 +123,12 @@ const LoopMeasurementChart = () => { x: { type: "time", time: { - unit: "minute", // Stelle sicher, dass jede Minute angezeigt wird - tooltipFormat: "dd.MM.yyyy HH:mm", // Tooltip zeigt Datum & Uhrzeit + unit: "minute", + tooltipFormat: "dd.MM.yyyy HH:mm", displayFormats: { - minute: "dd.MM.yyyy HH:mm", // Zeigt bei jedem Tick Datum & Uhrzeit - hour: "dd.MM.yyyy HH:mm", // Falls stündliche Werte vorliegen - day: "dd.MM.yyyy", // Falls tägliche Werte angezeigt werden + minute: "dd.MM.yyyy HH:mm", + hour: "dd.MM.yyyy HH:mm", + day: "dd.MM.yyyy", }, }, title: { @@ -136,8 +136,8 @@ const LoopMeasurementChart = () => { text: "Zeit (Datum & Uhrzeit)", }, ticks: { - autoSkip: false, // Keine Ticks auslassen - maxRotation: 45, // Falls nötig, dreht die Labels für bessere Lesbarkeit + autoSkip: false, + maxRotation: 45, minRotation: 45, callback: function (value, index, values) { const date = new Date(value); @@ -155,6 +155,30 @@ const LoopMeasurementChart = () => { }, }, }, + y: { + ticks: { + callback: function (value) { + return value.toFixed(2); // Y-Achse Werte mit zwei Dezimalstellen anzeigen + }, + }, + }, + }, + plugins: { + tooltip: { + callbacks: { + label: function (tooltipItem) { + let label = tooltipItem.dataset.label || ""; + if (label) { + label += ": "; + } + if (tooltipItem.raw !== null) { + label += + parseFloat(tooltipItem.raw.y).toFixed(2) + " kOhm"; // Dezimalstellen im Tooltip + } + return label; + }, + }, + }, }, }, }); diff --git a/config/webVersion.ts b/config/webVersion.ts index 1719a31..f6b72f1 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.72"; +const webVersion = "1.6.73"; export default webVersion;