Graph per YEAR

[elbertov]

Hi all,

Unfortunately there is no statistic period per YEAR and derivate Y possible (See #189 ).
So I decided to write a little bit of code to to achieve the task at hand :-)

type: custom:plotly-graph
entities:
  - entity: sensor.gas_consumed
    show_value: true
    type: bar
    statistic: state
    period: month
    filters:
      - derivate: M
      - fn: |-
          (params) => {
            const ys = [];
            const xs = [];
            var yeartotal=0;   // The calculated total in a year
            var year=0;        // The year for which the total has to be calculated

            // Loop through the datapoints, calculate the yeartotals and place the yeartotal on a (new) timeline
            for (i=0; i<params.statistics.length; i++)
            {
              if (i==0)
              {
                // Initializingstuff at the first datapoint
                yeartotal = 0;                             // set the yeartotal so far to zero
                year = params.xs[i].getFullYear();         // the (first) year that has to be calculated
              }
              else
              {
                if (params.xs[i].getFullYear() == year)
                {
                  // datapoint is in the same year as the previous datapoint so add it to the total
                  yeartotal += params.ys[i];              
                }
                else
                {
                  // datapoint is NOT in the same year as the previous datapoint
                  // push it on the new time line on January 1st of that year
                  xs.push(new Date("01-01-" + year + " 00:00:00"));
                  ys.push(yeartotal);

                  // reset for a new year to calculate
                  year      = params.xs[i].getFullYear(); // remember the new year that was to be calculated
                  yeartotal = params.ys[i];               // the current datapoint is already of the new year
                }
              }
            }

            // Add the last year
            xs.push(new Date("01-01-" + year + " 00:00:00"));
            ys.push(yeartotal);

            // And done - return the new graph data
            return {xs, ys};
          }
hours_to_show: 28000
layout:
  height: 600

The only thing is the "hours_to_show", I cannot calculate it I think, so I put it there manually.

[dbuezas]

Very nice!

PS: I fixed the code block in your post.
The syntax is:

```yaml
[your yaml here]
```

[dbuezas]

I think something like this may also work:

filters:
  - integrate
  - resample: 1y
  - derivate