diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml
index 1913a21..b468c45 100644
--- a/.devcontainer/ui-lovelace.yaml
+++ b/.devcontainer/ui-lovelace.yaml
@@ -215,8 +215,13 @@ views:
- type: custom:apexcharts-card
span:
start: day
+ y_axis_precision: 5
+ header:
+ show: true
+ show_states: true
series:
- entity: sensor.pvpc
+ float_precision: 5
data_generator: |
return [...Array(22).keys()].map((hour) => {
const attr = 'price_' + `${hour}`.padStart(2, '0') + 'h';
diff --git a/README.md b/README.md
index ac8773a..d71fbd1 100644
--- a/README.md
+++ b/README.md
@@ -101,6 +101,7 @@ The card stricly validates all the options available (but not for the `apex_conf
| `stacked` | boolean | `false` | v1.0.0 | Enable if you want the data to be stacked on the graph |
| `layout` | string | | v1.0.0 | See [layouts](#layouts) |
| `header` | string | | v1.0.0 | See [header](#header-options) |
+| `y_axis_precision` | numnber | `1` | NEXT_VERSION | The float precision used to display numbers on the Y axis |
| `apex_config`| object | | v1.0.0 | Apexcharts API 1:1 mapping. You call see all the options [here](https://apexcharts.com/docs/installation/) --> `Options (Reference)` in the Menu. See [Apex Charts](#apex-charts-options-example) |
@@ -116,6 +117,7 @@ The card stricly validates all the options available (but not for the `apex_conf
| `curve` | string | `smooth` | v1.0.0 | `smooth` (nice curve), `straight` (direct line between points) or `stepline` (flat line until next point then straight up or down) |
| `extend_to_end` | boolean | `true` | v1.0.0 | If the last data is older than the end time displayed on the graph, setting to true will extend the value until the end of the timeline. Only works for `line` and `area` types. |
| `unit` | string | | v1.0.0 | Override the unit of the sensor |
+| `float_precision` | number | `1` | NEXT_VERSION | The precision used to display data in the legend and the tooltip. It doesn't impact how the data is displayed on the graph |
| `group_by` | object | | v1.0.0 | See [group_by](#group_by-options) |
| `invert` | boolean | `false` | NEXT_VERSION | Negates the data (`1` -> `-1`). Usefull to display opposites values like network in (standard)/out (inverted) |
| `data_generator` | string | | NEXT_VERSION | See [data_generator](#data_generator-option) |
diff --git a/src/apex-layouts.ts b/src/apex-layouts.ts
index 77d6406..2b5572f 100644
--- a/src/apex-layouts.ts
+++ b/src/apex-layouts.ts
@@ -1,6 +1,6 @@
import { HomeAssistant } from 'custom-card-helpers';
import parse from 'parse-duration';
-import { HOUR_24, moment } from './const';
+import { DEFAULT_FLOAT_PRECISION, HOUR_24, moment } from './const';
import { ChartCardConfig } from './types';
import { computeName, computeUom, mergeDeep } from './utils';
@@ -43,7 +43,7 @@ export function getLayoutConfig(config: ChartCardConfig, hass: HomeAssistant | u
yaxis: Array.isArray(config.apex_config?.yaxis)
? undefined
: {
- decimalsInFloat: 1,
+ decimalsInFloat: config.y_axis_precision === undefined ? DEFAULT_FLOAT_PRECISION : config.y_axis_precision,
},
tooltip: {
x: {
@@ -60,7 +60,11 @@ export function getLayoutConfig(config: ChartCardConfig, hass: HomeAssistant | u
y: {
formatter: function (value, opts, conf = config, hass2 = hass) {
if (value !== null && typeof value === 'number' && !Number.isInteger(value)) {
- value = (value as number).toFixed(1);
+ value = (value as number).toFixed(
+ conf.series[opts.seriesIndex].float_precision === undefined
+ ? DEFAULT_FLOAT_PRECISION
+ : conf.series[opts.seriesIndex].float_precision,
+ );
}
const uom = computeUom(
opts.seriesIndex,
@@ -92,7 +96,11 @@ export function getLayoutConfig(config: ChartCardConfig, hass: HomeAssistant | u
computeName(opts.seriesIndex, conf, undefined, hass2?.states[conf.series[opts.seriesIndex].entity]) + ':';
let value = opts.w.globals.series[opts.seriesIndex].slice(-1)[0];
if (value !== null && typeof value === 'number' && !Number.isInteger(value)) {
- value = (value as number).toFixed(1);
+ value = (value as number).toFixed(
+ conf.series[opts.seriesIndex].float_precision === undefined
+ ? DEFAULT_FLOAT_PRECISION
+ : conf.series[opts.seriesIndex].float_precision,
+ );
}
const uom = computeUom(opts.seriesIndex, conf, undefined, hass2?.states[conf.series[opts.seriesIndex].entity]);
return [name, value === undefined ? `N/A ${uom}` : `${value} ${uom}`];
diff --git a/src/apexcharts-card.ts b/src/apexcharts-card.ts
index 438082a..018b021 100644
--- a/src/apexcharts-card.ts
+++ b/src/apexcharts-card.ts
@@ -22,7 +22,7 @@ import GraphEntry from './graphEntry';
import { createCheckers } from 'ts-interface-checker';
import { ChartCardExternalConfig } from './types-config';
import exportedTypeSuite from './types-config-ti';
-import { moment } from './const';
+import { DEFAULT_FLOAT_PRECISION, moment } from './const';
import {
DEFAULT_COLORS,
DEFAULT_DURATION,
@@ -357,7 +357,12 @@ class ChartsCard extends LitElement {
typeof this._lastState[index] === 'number' &&
!Number.isInteger(this._lastState[index])
) {
- this._lastState[index] = (this._lastState[index] as number).toFixed(1);
+ const precision =
+ this._config?.series[index].float_precision === undefined
+ ? DEFAULT_FLOAT_PRECISION
+ : // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ this._config.series[index].float_precision!;
+ this._lastState[index] = (this._lastState[index] as number).toFixed(precision);
}
}
let data: (number | null)[][] = [];
diff --git a/src/const.ts b/src/const.ts
index 15754d1..f43d09e 100644
--- a/src/const.ts
+++ b/src/const.ts
@@ -11,6 +11,8 @@ export const DEFAULT_DURATION = '1h';
export const DEFAULT_FUNC = 'raw';
export const DEFAULT_GROUP_BY_FILL = 'last';
+export const DEFAULT_FLOAT_PRECISION = 1;
+
export const DEFAULT_COLORS = [
'var(--accent-color)',
'#3498db',
diff --git a/src/types-config-ti.ts b/src/types-config-ti.ts
index 6ac8fa1..0735db0 100644
--- a/src/types-config-ti.ts
+++ b/src/types-config-ti.ts
@@ -10,6 +10,7 @@ export const ChartCardExternalConfig = t.iface([], {
"series": t.array("ChartCardSeriesExternalConfig"),
"graph_span": t.opt("string"),
"span": t.opt("ChartCardSpanExtConfig"),
+ "y_axis_precision": t.opt("number"),
"show": t.opt(t.iface([], {
"loading": t.opt("boolean"),
})),
@@ -36,6 +37,7 @@ export const ChartCardSeriesExternalConfig = t.iface([], {
"unit": t.opt("string"),
"invert": t.opt("boolean"),
"data_generator": t.opt("string"),
+ "float_precision": t.opt("number"),
"group_by": t.opt(t.iface([], {
"duration": t.opt("string"),
"func": t.opt("GroupByFunc"),
diff --git a/src/types-config.ts b/src/types-config.ts
index 0915ddf..d1c46d4 100644
--- a/src/types-config.ts
+++ b/src/types-config.ts
@@ -4,6 +4,7 @@ export interface ChartCardExternalConfig {
series: ChartCardSeriesExternalConfig[];
graph_span?: string;
span?: ChartCardSpanExtConfig;
+ y_axis_precision?: number;
show?: {
loading?: boolean;
};
@@ -30,6 +31,7 @@ export interface ChartCardSeriesExternalConfig {
unit?: string;
invert?: boolean;
data_generator?: string;
+ float_precision?: number;
group_by?: {
duration?: string;
func?: GroupByFunc;