fix: extremas would not display with offset applied on series

Fix RomRider#177
georgepauna · Jul 12, 2021 · 4d7d77a · 4d7d77a
1 parent 986a717
commit 4d7d77a
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 7 deletions.
diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml
@@ -1108,8 +1108,8 @@ views:
           - type: custom:apexcharts-card
             experimental:
               color_threshold: true
-            graph_span: 4h
-            update_interval: 1h
+            graph_span: 12min
+            # update_interval: 1h
             yaxis:
               - id: one
                 decimals: 0
@@ -1120,6 +1120,8 @@ views:
                 opposite: true
                 min: ~20
                 max: ~65
+            all_series_config:
+              offset: -5h
             series:
               - entity: sensor.random0_100
                 transform: return x % 4;
@@ -1134,6 +1136,8 @@ views:
                     color: red
                   - value: 9
                     color: purple
+                show:
+                  extremas: time
                 group_by:
                   func: avg
                   duration: 3min

diff --git a/src/apexcharts-card.ts b/src/apexcharts-card.ts
@@ -239,7 +239,10 @@ class ChartsCard extends LitElement {
           this._graphs[index]!.hass = this._hass!;
         }
         if (serie.show.in_header === 'raw') {
-          this._headerState[index] = serie.attribute ? entityState.attributes[serie.attribute] : entityState.state;
+          this._headerState[index] = truncateFloat(
+            serie.attribute ? entityState.attributes[serie.attribute] : entityState.state,
+            serie.float_precision,
+          ) as number;
           rawHeaderStatesUpdated = true;
         }
       }
@@ -959,8 +962,26 @@ class ChartsCard extends LitElement {
           const txtColor = computeTextColor(bgColor);
           if (!min[0] || !max[0]) return [];
           return [
-            ...this._getPointAnnotationStyle(min, bgColor, txtColor, serie, index, serie.invert, sameDay),
-            ...this._getPointAnnotationStyle(max, bgColor, txtColor, serie, index, serie.invert, sameDay),
+            ...this._getPointAnnotationStyle(
+              min,
+              this._seriesOffset[index],
+              bgColor,
+              txtColor,
+              serie,
+              index,
+              serie.invert,
+              sameDay,
+            ),
+            ...this._getPointAnnotationStyle(
+              max,
+              this._seriesOffset[index],
+              bgColor,
+              txtColor,
+              serie,
+              index,
+              serie.invert,
+              sameDay,
+            ),
           ];
         } else {
           return [];
@@ -971,6 +992,7 @@ class ChartsCard extends LitElement {
 
   private _getPointAnnotationStyle(
     value: HistoryPoint,
+    offset: number,
     bgColor: string,
     txtColor: string,
     serie: ChartCardSeriesConfig,
@@ -985,7 +1007,7 @@ class ChartsCard extends LitElement {
       Array.isArray(this._config.apex_config.yaxis) &&
       this._config.apex_config.yaxis.length > 1;
     points.push({
-      x: value[0],
+      x: offset ? value[0] - offset : value[0],
       y: invert && value[1] ? -value[1] : value[1],
       seriesIndex: index,
       yAxisIndex: multiYAxis ? index : 0,
@@ -1014,7 +1036,7 @@ class ChartsCard extends LitElement {
         options.dateStyle = 'medium';
       }
       points.push({
-        x: value[0],
+        x: offset ? value[0] - offset : value[0],
         y: invert && value[1] ? -value[1] : value[1],
         seriesIndex: index,
         yAxisIndex: multiYAxis ? index : 0,