From 2e1e6922f638d9819f3bdd397954d26d627622e0 Mon Sep 17 00:00:00 2001
From: Artem Dzhereleiko <Dgerik2015@gmail.com>
Date: Mon, 9 Jun 2025 12:36:17 +0300
Subject: [PATCH] UI: unitService to ctx, ref id from settings to
 objectHashCode and remove showZeroDecimals

---
 .../3-phase-voltage-relay-hp.svg              |  6 +--
 .../scada_symbols/bottom-flow-meter.svg       |  2 +-
 .../dynamic-horizontal-scale-hp.svg           |  2 +-
 .../dynamic-vertical-scale-hp.svg             |  2 +-
 .../system/scada_symbols/energy-meter-hp.svg  |  2 +-
 .../four-rate-energy-meter-hp.svg             |  8 ++--
 .../horizontal-inline-flow-meter.svg          |  2 +-
 .../system/scada_symbols/left-flow-meter.svg  |  2 +-
 .../system/scada_symbols/right-flow-meter.svg |  2 +-
 .../simple-horizontal-scale-hp.svg            |  2 +-
 .../simple-vertical-scale-hp.svg              |  2 +-
 .../three-rate-energy-meter-hp.svg            |  6 +--
 .../system/scada_symbols/top-flow-meter.svg   |  2 +-
 .../two-rate-energy-meter-hp.svg              |  4 +-
 .../vertical-inline-flow-meter.svg            |  2 +-
 .../widget/dynamic-widget.component.ts        |  2 +
 .../widget/lib/scada/scada-symbol.models.ts   | 38 +++++++++----------
 .../home/models/widget-component.models.ts    |  2 +
 .../scada-symbol-editor.models.ts             |  3 +-
 19 files changed, 46 insertions(+), 45 deletions(-)

diff --git a/application/src/main/data/json/system/scada_symbols/3-phase-voltage-relay-hp.svg b/application/src/main/data/json/system/scada_symbols/3-phase-voltage-relay-hp.svg
index 1152103805..8e1a46978e 100644
--- a/application/src/main/data/json/system/scada_symbols/3-phase-voltage-relay-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/3-phase-voltage-relay-hp.svg
@@ -39,7 +39,7 @@
     },
     {
       "tag": "firstPhaseValue",
-      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.firstPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, id: 0}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.firstPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
@@ -49,7 +49,7 @@
     },
     {
       "tag": "secondPhaseValue",
-      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.secondPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, id: 1}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.secondPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
@@ -59,7 +59,7 @@
     },
     {
       "tag": "thirdPhaseValue",
-      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.thirdPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, id: 2}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.values.running) {\n    element.show();\n    ctx.api.font(element, ctx.properties.currentVoltageFont, ctx.properties.currentVoltageColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.thirdPhaseVoltage, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
index e003565dd2..f3c20f2324 100644
--- a/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/application/src/main/data/json/system/scada_symbols/dynamic-horizontal-scale-hp.svg b/application/src/main/data/json/system/scada_symbols/dynamic-horizontal-scale-hp.svg
index 5dc0de1372..7b11968223 100644
--- a/application/src/main/data/json/system/scada_symbols/dynamic-horizontal-scale-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/dynamic-horizontal-scale-hp.svg
@@ -78,7 +78,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/dynamic-vertical-scale-hp.svg b/application/src/main/data/json/system/scada_symbols/dynamic-vertical-scale-hp.svg
index 020874f35d..37ba3df7c2 100644
--- a/application/src/main/data/json/system/scada_symbols/dynamic-vertical-scale-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/dynamic-vertical-scale-hp.svg
@@ -78,7 +78,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/energy-meter-hp.svg b/application/src/main/data/json/system/scada_symbols/energy-meter-hp.svg
index 51966854a1..3855d66ec8 100644
--- a/application/src/main/data/json/system/scada_symbols/energy-meter-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/energy-meter-hp.svg
@@ -43,7 +43,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.measured, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.measured, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/four-rate-energy-meter-hp.svg b/application/src/main/data/json/system/scada_symbols/four-rate-energy-meter-hp.svg
index 5e43858202..e095c1417f 100644
--- a/application/src/main/data/json/system/scada_symbols/four-rate-energy-meter-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/four-rate-energy-meter-hp.svg
@@ -38,7 +38,7 @@
     },
     {
       "tag": "export-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.exportValueFont, ctx.properties.exportValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.exportRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 3}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.exportValueFont, ctx.properties.exportValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.exportRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -48,7 +48,7 @@
     },
     {
       "tag": "night-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 1}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -58,7 +58,7 @@
     },
     {
       "tag": "off-peak-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.offPeakValueFont, ctx.properties.offPeakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.offPeakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 0}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.offPeakValueFont, ctx.properties.offPeakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.offPeakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -68,7 +68,7 @@
     },
     {
       "tag": "peak-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.peakValueFont, ctx.properties.peakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.peakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 2}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.peakValueFont, ctx.properties.peakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.peakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
index 555293931e..a2ca312730 100644
--- a/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
index 55c60de9ea..e121adaffd 100644
--- a/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
index 53a2585fd0..3984083640 100644
--- a/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/application/src/main/data/json/system/scada_symbols/simple-horizontal-scale-hp.svg b/application/src/main/data/json/system/scada_symbols/simple-horizontal-scale-hp.svg
index bd29ac0c4b..9425ed48f2 100644
--- a/application/src/main/data/json/system/scada_symbols/simple-horizontal-scale-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/simple-horizontal-scale-hp.svg
@@ -78,7 +78,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/simple-vertical-scale-hp.svg b/application/src/main/data/json/system/scada_symbols/simple-vertical-scale-hp.svg
index ed2eb8ec07..4e14130ef3 100644
--- a/application/src/main/data/json/system/scada_symbols/simple-vertical-scale-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/simple-vertical-scale-hp.svg
@@ -78,7 +78,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false}));\n} else {\n    element.hide();\n}",
+      "stateRenderFunction": "if (ctx.properties.value) {\n    element.show();\n    ctx.api.font(element, ctx.properties.valueFont, ctx.properties.valueColor);\n    ctx.api.text(element, ctx.api.formatValue(ctx.values.value, {units: ctx.properties.units, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true}));\n} else {\n    element.hide();\n}",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/three-rate-energy-meter-hp.svg b/application/src/main/data/json/system/scada_symbols/three-rate-energy-meter-hp.svg
index 11e27b2af8..526f6aa719 100644
--- a/application/src/main/data/json/system/scada_symbols/three-rate-energy-meter-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/three-rate-energy-meter-hp.svg
@@ -38,7 +38,7 @@
     },
     {
       "tag": "night-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 1}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -48,7 +48,7 @@
     },
     {
       "tag": "off-peak-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.offPeakValueFont, ctx.properties.offPeakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.offPeakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 0}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.offPeakValueFont, ctx.properties.offPeakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.offPeakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -58,7 +58,7 @@
     },
     {
       "tag": "peak-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.peakValueFont, ctx.properties.peakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.peakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 2}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.peakValueFont, ctx.properties.peakValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.peakRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
index 9f7824b4ae..ae9b6701af 100644
--- a/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/application/src/main/data/json/system/scada_symbols/two-rate-energy-meter-hp.svg b/application/src/main/data/json/system/scada_symbols/two-rate-energy-meter-hp.svg
index 444a41cb08..e87548f059 100644
--- a/application/src/main/data/json/system/scada_symbols/two-rate-energy-meter-hp.svg
+++ b/application/src/main/data/json/system/scada_symbols/two-rate-energy-meter-hp.svg
@@ -38,7 +38,7 @@
     },
     {
       "tag": "day-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.dayValueFont, ctx.properties.dayValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.dayRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 0}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.dayValueFont, ctx.properties.dayValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.dayRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
@@ -48,7 +48,7 @@
     },
     {
       "tag": "night-rate",
-      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true, showZeroDecimals: false, id: 1}));",
+      "stateRenderFunction": "ctx.api.font(element, ctx.properties.nightValueFont, ctx.properties.nightValueColor);\nctx.api.text(element, ctx.api.formatValue(ctx.values.nightRate, {units: ctx.properties.units, decimals: 0, ignoreUnitSymbol: true}));",
       "actions": null
     },
     {
diff --git a/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
index 544a83dc06..e270024f8b 100644
--- a/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
@@ -57,7 +57,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true, showZeroDecimals: false});\nctx.api.text(element, value);\n",
+      "stateRenderFunction": "var value = ctx.api.formatValue(ctx.values.value, {units: ctx.properties.valueUnits, decimals: ctx.properties.valueDecimals, ignoreUnitSymbol: true});\nctx.api.text(element, value);\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
diff --git a/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts
index b6919ec670..8458419ed8 100644
--- a/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts
@@ -52,6 +52,7 @@ import { MillisecondsToTimeStringPipe } from '@shared/pipe/milliseconds-to-time-
 import { UserSettingsService } from '@core/http/user-settings.service';
 import { ImagePipe } from '@shared/pipe/image.pipe';
 import { UtilsService } from '@core/services/utils.service';
+import { UnitService } from '@core/services/unit.service';
 
 @Directive()
 // eslint-disable-next-line @angular-eslint/directive-class-suffix
@@ -92,6 +93,7 @@ export class DynamicWidgetComponent extends PageComponent implements IDynamicWid
     this.ctx.userSettingsService = this.$injector.get(UserSettingsService);
     this.ctx.utilsService = this.$injector.get(UtilsService);
     this.ctx.telemetryWsService = this.$injector.get(TelemetryWebsocketService);
+    this.ctx.unitService = this.$injector.get(UnitService);
     this.ctx.date = this.$injector.get(DatePipe);
     this.ctx.imagePipe = this.$injector.get(ImagePipe);
     this.ctx.milliSecondsToTimeString = this.$injector.get(MillisecondsToTimeStringPipe);
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/scada/scada-symbol.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/scada/scada-symbol.models.ts
index aa7669156a..ee46dd6ad4 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/scada/scada-symbol.models.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/scada/scada-symbol.models.ts
@@ -51,7 +51,7 @@ import {
   isUndefined,
   isUndefinedOrNull,
   mergeDeep,
-  mergeDeepIgnoreArray,
+  mergeDeepIgnoreArray, objectHashCode,
   parseFunction
 } from '@core/utils';
 import { BehaviorSubject, forkJoin, Observable, Observer, of, Subject } from 'rxjs';
@@ -82,7 +82,7 @@ import { TbUnit } from '@shared/models/unit.models';
 export interface ScadaSymbolApi {
   generateElementId: () => string;
   formatValue(value: any, dec?: number, units?: string, showZeroDecimals?: boolean): string | undefined;
-  formatValue(value: any, settings: ValueFormatIdSettings): string;
+  formatValue(value: any, settings: ValueFormatSettings): string;
   text: (element: Element | Element[], text: string) => void;
   font: (element: Element | Element[], font: Font, color: string) => void;
   icon: (element: Element | Element[], icon: string, size?: number, color?: string, center?: boolean) => void;
@@ -184,10 +184,6 @@ export interface ScadaSymbolMetadata {
   properties: FormProperty[];
 }
 
-interface ValueFormatIdSettings extends ValueFormatSettings {
-  id?: number;
-}
-
 export const emptyMetadata = (width?: number, height?: number): ScadaSymbolMetadata => ({
   title: '',
   widgetSizeX: width ? Math.max(Math.round(width/100), 1) : 3,
@@ -828,28 +824,28 @@ export class ScadaSymbolObject {
   }
 
   private unitSymbol(unit: TbUnit): string {
-    return this.ctx.$scope.$injector.get(this.ctx.servicesMap.get('unitService')).getTargetUnitSymbol(unit);
+    return this.ctx.unitService.getTargetUnitSymbol(unit);
   }
 
   private convertUnitValue(value: number, unit: TbUnit): number {
-    return this.ctx.$scope.$injector.get(this.ctx.servicesMap.get('unitService')).convertUnitValue(value, unit);
+    return this.ctx.unitService.convertUnitValue(value, unit);
   }
 
-  private formatValue(value: any, settings: ValueFormatIdSettings): string;
+  private formatValue(value: any, settings: ValueFormatSettings): string;
   private formatValue(value: any, dec?: number, units?: string, showZeroDecimals?: boolean): string | undefined;
-  private formatValue(value: any, settingsOrDec?: ValueFormatIdSettings | number, units?: string, showZeroDecimals?: boolean): string {
-    const id = (settingsOrDec as ValueFormatIdSettings)?.id || 0;
-    if (!this.valueProcessor[id]) {
-      let valueFormatSettings: ValueFormatSettings;
-      if (typeof settingsOrDec === 'object') {
-        valueFormatSettings = deepClone(settingsOrDec, ['id']);
-      } else {
-        valueFormatSettings = {
-          units,
-          decimals: settingsOrDec,
-          showZeroDecimals
-        }
+  private formatValue(value: any, settingsOrDec?: ValueFormatSettings | number, units?: string, showZeroDecimals?: boolean): string {
+    let valueFormatSettings: ValueFormatSettings;
+    if (typeof settingsOrDec === 'object') {
+      valueFormatSettings = deepClone(settingsOrDec);
+    } else {
+      valueFormatSettings = {
+        units,
+        decimals: settingsOrDec,
+        showZeroDecimals
       }
+    }
+    const id = objectHashCode(valueFormatSettings) + '';
+    if (!this.valueProcessor[id]) {
       this.valueProcessor[id] = ValueFormatProcessor.fromSettings(this.ctx.$injector, valueFormatSettings);
     }
     return this.valueProcessor[id].format(value);
diff --git a/ui-ngx/src/app/modules/home/models/widget-component.models.ts b/ui-ngx/src/app/modules/home/models/widget-component.models.ts
index 8d2622ebea..4a22129ba8 100644
--- a/ui-ngx/src/app/modules/home/models/widget-component.models.ts
+++ b/ui-ngx/src/app/modules/home/models/widget-component.models.ts
@@ -118,6 +118,7 @@ import { CompiledTbFunction } from '@shared/models/js-function.models';
 import { FormProperty } from '@shared/models/dynamic-form.models';
 import { ExportableEntity } from '@shared/models/base-data';
 import { TbUnit } from '@shared/models/unit.models';
+import { UnitService } from '@core/services/unit.service';
 
 export interface IWidgetAction {
   name: string;
@@ -225,6 +226,7 @@ export class WidgetContext {
   userSettingsService: UserSettingsService;
   utilsService: UtilsService;
   telemetryWsService: TelemetryWebsocketService;
+  unitService: UnitService;
   telemetrySubscribers?: Array<TelemetrySubscriber | SharedTelemetrySubscriber>;
   date: DatePipe;
   imagePipe: ImagePipe;
diff --git a/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol-editor.models.ts b/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol-editor.models.ts
index a9edc152e9..e7a4380c4a 100644
--- a/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol-editor.models.ts
+++ b/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol-editor.models.ts
@@ -1313,7 +1313,8 @@ export const scadaSymbolContextCompletion = (metadata: ScadaSymbolMetadata, tags
               },
               {
                 name: 'settingsOrDec',
-                description: 'Either a ValueFormatIdSettings object containing formatting settings or the number of decimal digits. ValueFormatIdSettings includes: decimals (number of decimal digits, optional), units (unit specification as string or TbUnitMapping, optional), showZeroDecimals (whether to keep zero decimal digits, optional), ignoreUnitSymbol (whether to exclude unit symbol from output, optional), and id (unique identifier for the processor, optional).',                type: 'ValueFormatIdSettings | number',
+                description: 'Either a ValueFormatSettings object containing formatting settings or the number of decimal digits. ValueFormatSettings includes: decimals (number of decimal digits, optional), units (unit specification as string or TbUnitMapping, optional), showZeroDecimals (whether to keep zero decimal digits, optional), ignoreUnitSymbol (whether to exclude unit symbol from output, optional).',
+                type: 'ValueFormatSettings | number',
                 optional: true
               },
               {