fix(yaxis): when in_chart: false, yaxis generated config would be…

… wrong Fixes #724
RomRider · Jul 9, 2024 · 5932f2f · 5932f2f
1 parent 4828d48
commit 5932f2f
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 32 deletions.
diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml
@@ -1355,6 +1355,12 @@ views:
         stacked: true
         cache: false
         graph_span: 5min
+        header:
+          show: true
+          show_states: true
+          colorize_states: true
+        yaxis:
+          - id: should_work
         series:
           - entity: sensor.random0_100
             stack_group: group1
@@ -1366,12 +1372,25 @@ views:
               duration: 1min
             show:
               in_legend: false
+              in_header: false
           - entity: sensor.random0_100
             stack_group: group1
             type: column
+            show:
+              in_header: false
             # name: pioup
           - entity: sensor.random_0_1000
             type: column
+            show:
+              in_header: false
+            group_by:
+              duration: 1min
+          - entity: sensor.random_0_1000
+            name: only in header
+            type: column
+            show:
+              in_chart: false
+              in_header: true
             group_by:
               duration: 1min
-            # stack_group: group1
+            # stack_group: group1
diff --git a/src/apexcharts-card.ts b/src/apexcharts-card.ts
@@ -372,36 +372,6 @@ class ChartsCard extends LitElement {
 
       const defColors = this._config?.color_list || DEFAULT_COLORS;
       if (this._config) {
-        if (this._config.yaxis && this._config.yaxis.length > 1) {
-          if (
-            this._config.series.some((serie) => {
-              return !serie.yaxis_id;
-            })
-          ) {
-            throw new Error(`Multiple yaxis detected: Some series are missing the 'yaxis_id' configuration.`);
-          }
-          if (
-            this._config.yaxis.some((yaxis) => {
-              return !yaxis.id;
-            })
-          ) {
-            throw new Error(`Multiple yaxis detected: Some yaxis are missing an 'id'.`);
-          }
-        }
-        if (this._config.yaxis) {
-          const yAxisConfig = this._generateYAxisConfig(this._config);
-          if (this._config.apex_config) {
-            this._config.apex_config.yaxis = yAxisConfig;
-          } else {
-            this._config.apex_config = {
-              yaxis: yAxisConfig,
-            };
-          }
-          this._yAxisConfig?.forEach((yaxis) => {
-            [yaxis.min, yaxis.min_type] = this._getTypeOfMinMax(yaxis.min);
-            [yaxis.max, yaxis.max_type] = this._getTypeOfMinMax(yaxis.max);
-          });
-        }
         this._graphs = this._config.series.map((serie, index) => {
           serie.index = index;
           serie.ignore_history = !!(
@@ -493,6 +463,36 @@ class ChartsCard extends LitElement {
             this._config!.series_in_brush.push(serie);
           }
         });
+        if (this._config.yaxis && this._config.yaxis.length > 1) {
+          if (
+            this._config.series_in_graph.some((serie) => {
+              return !serie.yaxis_id;
+            })
+          ) {
+            throw new Error(`Multiple yaxis detected: Some series are missing the 'yaxis_id' configuration.`);
+          }
+          if (
+            this._config.yaxis.some((yaxis) => {
+              return !yaxis.id;
+            })
+          ) {
+            throw new Error(`Multiple yaxis detected: Some yaxis are missing an 'id'.`);
+          }
+        }
+        if (this._config.yaxis) {
+          const yAxisConfig = this._generateYAxisConfig(this._config);
+          if (this._config.apex_config) {
+            this._config.apex_config.yaxis = yAxisConfig;
+          } else {
+            this._config.apex_config = {
+              yaxis: yAxisConfig,
+            };
+          }
+          this._yAxisConfig?.forEach((yaxis) => {
+            [yaxis.min, yaxis.min_type] = this._getTypeOfMinMax(yaxis.min);
+            [yaxis.max, yaxis.max_type] = this._getTypeOfMinMax(yaxis.max);
+          });
+        }
         this._headerColors = this._headerColors.slice(0, this._config?.series.length);
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -508,7 +508,7 @@ class ChartsCard extends LitElement {
     if (!config.yaxis) return undefined;
     const burned: boolean[] = [];
     this._yAxisConfig = JSON.parse(JSON.stringify(config.yaxis));
-    const yaxisConfig: ApexYAxis[] = config.series.map((serie, serieIndex) => {
+    const yaxisConfig: ApexYAxis[] = config.series_in_graph.map((serie, serieIndex) => {
       let idx = -1;
       if (config.yaxis?.length !== 1) {
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion