added reset_every and offset options to the integrate filter (#210)

Author: dbuezas

readme.md

@@ -458,8 +458,12 @@ entities:
     - delta # computes the delta between each two consecutive numeric y values.
     - derivate: h # computes rate of change per unit of time: h # ms (milisecond), s (second), m (minute), h (hour), d (day), w (week), M (month), y (year)
     - integrate: h # computes area under the curve per unit of time using Right hand riemann integration. Same units as the derivative
-    - map_y_numbers: Math.sqrt(y + 10*100) # map the y coordinate of each datapoint. Same available variables as for `map_y`
+    - integrate:
+        unit: h # defaults to h
+        reset_every: 1h # Defaults to 0 (never reset). Any duration unit (ms, s, m, h, d, w, M, y).
+        offset: 30m # defaults to 0. Resets happen 30m later
 
+    - map_y_numbers: Math.sqrt(y + 10*100) # map the y coordinate of each datapoint. Same available variables as for `map_y`
     # In the filters below, missing and non numeric datapoints will be discarded
     - sliding_window_moving_average: # best for smoothing
         # default parameters:

src/filters/filters.ts

@@ -140,14 +140,32 @@ const filters = {
         }),
       };
     },
-  integrate:
-    (unit: keyof typeof timeUnits = "h") =>
-    ({ xs, ys, meta }) => {
-      checkTimeUnits(unit);
-      checkTimeUnits(unit);
+  integrate: (
+    unitOrObject:
+      | keyof typeof timeUnits
+      | {
+          unit?: keyof typeof timeUnits;
+          reset_every?: TimeDurationStr;
+          offset?: TimeDurationStr;
+        } = "h"
+  ) => {
+    const param =
+      typeof unitOrObject == "string" ? { unit: unitOrObject } : unitOrObject;
+    console.log(`param`, param);
+    const unit = param.unit ?? "h";
+    const reset_every = parseTimeDuration(param.reset_every ?? "0s");
+    const offset = parseTimeDuration(param.offset ?? "0s");
+    checkTimeUnits(unit);
+    const date = new Date();
+    date.setHours(0);
+    date.setMinutes(0);
+    date.setSeconds(0);
+    const t0 = +date + offset;
+    return ({ xs, ys, meta }) => {
       let yAcc = 0;
       let last = {
         x: NaN,
+        laps: 0,
       };
       return {
         meta: {
@@ -157,6 +175,13 @@ const filters = {
         xs: xs,
         ys: mapNumbers(ys, (y, i) => {
           const x = +xs[i];
+          if (reset_every > 0) {
+            const laps = Math.floor((x - t0) / reset_every);
+            if (laps !== last.laps) {
+              yAcc = 0;
+              last.laps = laps;
+            }
+          }
           const dateDelta = (x - last.x) / timeUnits[unit];
           const isFirst = isNaN(last.x);
           last.x = x;
@@ -165,7 +190,8 @@ const filters = {
           return yAcc;
         }),
       };
-    },
+    };
+  },
   sliding_window_moving_average:
     ({ window_size = 10, extended = false, centered = true } = {}) =>
     (params) => {

src/plotly-graph-card.ts

@@ -329,11 +329,7 @@ export class PlotlyGraph extends HTMLElement {
     this.config = config;
     const is = this.config;
     this.touchController.isEnabled = !is.disable_pinch_to_zoom;
-    if (is.hours_to_show !== was?.hours_to_show || is.offset !== was?.offset) {
-      this.exitBrowsingMode();
-    } else {
-      await this.plot({ should_fetch: false });
-    }
+    this.exitBrowsingMode();
   }
   getCSSVars() {
     const styles = window.getComputedStyle(this.contentEl);