From 0c789ffc27be47b459bf22875e5a0b5243249197 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=B4me=20Wiedemann?= <jerome@wnetworks.org>
Date: Mon, 12 Jul 2021 16:42:47 +0000
Subject: [PATCH] fix: Floats were not truncated properly for radialBar

Fix #174
---
 .devcontainer/ui-lovelace.yaml |  3 ++-
 src/apex-layouts.ts            | 13 +++++++++++++
 src/utils.ts                   | 13 +++++++++++--
 3 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml
index 614dd61..9913511 100644
--- a/.devcontainer/ui-lovelace.yaml
+++ b/.devcontainer/ui-lovelace.yaml
@@ -438,10 +438,11 @@ views:
               - entity: sensor.random0_100
               - entity: sensor.random_0_1000
                 unit: Mbits/s
+                float_precision: 4
                 min: 0
                 max: 1000
                 group_by:
-                  func: max
+                  func: avg
                   duration: 30min
           - type: custom:apexcharts-card
             chart_type: pie
diff --git a/src/apex-layouts.ts b/src/apex-layouts.ts
index 55d89e4..e505981 100644
--- a/src/apex-layouts.ts
+++ b/src/apex-layouts.ts
@@ -355,6 +355,19 @@ function getPlotOptions_radialBar(config: ChartCardConfig) {
       track: {
         background: 'rgba(128, 128, 128, 0.2)',
       },
+      dataLabels: {
+        value: {
+          formatter: function (value, opts, conf = config) {
+            const index = opts?.config?.series?.findIndex((x) => {
+              return parseFloat(value) === x;
+            });
+            if (index != -1) {
+              return truncateFloat(value, conf.series_in_graph[index].float_precision) + '%';
+            }
+            return value;
+          },
+        },
+      },
     };
   } else {
     return {};
diff --git a/src/utils.ts b/src/utils.ts
index 5fde716..55f4148 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -234,10 +234,19 @@ export function is12Hour(locale: string): boolean {
   return !(new Date(2021, 1, 1, 15, 0, 0, 0).toLocaleTimeString(locale).indexOf('15') > -1);
 }
 
-export function truncateFloat(value: number | null | undefined, precision: number | undefined): string | number | null {
+export function truncateFloat(
+  value: string | number | null | undefined,
+  precision: number | undefined,
+): string | number | null {
   let lValue: string | number | null | undefined = value;
   if (lValue === undefined) return null;
-  if (value !== null && typeof value === 'number' && !Number.isInteger(value)) {
+  if (typeof lValue === 'string') {
+    lValue = parseFloat(lValue);
+    if (Number.isNaN(lValue)) {
+      return lValue;
+    }
+  }
+  if (lValue !== null && typeof lValue === 'number' && !Number.isInteger(lValue)) {
     lValue = (lValue as number).toFixed(precision === undefined ? DEFAULT_FLOAT_PRECISION : precision);
   }
   return lValue;