How to overlap an offset time series in OH3? (Corelate yesterdays values vs. today)

Setup, Configuration and Use Beginners
, ,
1

Hi all,

I’m a little bit lost because I think I’ve overseeing some issues.
I’m using the offset attribute, but the only thing that happens is more or less that he truncates the last day from yesterday.

Any ideas how i can compare today and yesterdays value in an unaggregated chart?

image
image1163×884 22.1 KB 

config:
  period: D
  label: LightBrightness
  sidebar: true
slots:
  grid:
    - component: oh-chart-grid
      config:
        includeLabels: true
  xAxis:
    - component: oh-time-axis
      config:
        gridIndex: 0
  yAxis:
    - component: oh-value-axis
      config:
        gridIndex: 0
  series:
    - component: oh-time-series
      config:
        name: LightBrightess
        gridIndex: 0
        xAxisIndex: 0
        yAxisIndex: 0
        type: line
        item: LightBrightness
    - component: oh-time-series
      config:
        name: LightBrightessYesterday
        gridIndex: 0
        xAxisIndex: 0
        yAxisIndex: 0
        type: line
        offsetAmount: 1
        offsetUnit: day
        item: LightBrightness
        service: rrd4j
  tooltip:
    - component: oh-chart-tooltip
      config:
        confine: true
        smartFormatter: true
  legend:
    - component: oh-chart-legend
      config:
        bottom: 3
        type: scroll
  dataZoom:
    - component: oh-chart-datazoom
      config:
        type: inside

I assume it’s something with the series.

Thanks you so much
/Franz

2

I am trying to do similar, but seeing different issues I think.

I am trying to chart a comparison of my electricity usage against the previous day. So I have one time series with my monitor’s amps item, and a second time series with the same item and offset by 1 day.

When I run my chart only the ‘today’ series is shown. The offset series is not shown. There’s an entry in the legend, but no lines and nothing shows up in the tooltip for it.

image
image933×687 24.8 KB 

config:
  period: D
  label: Power Usage
  sidebar: true
slots:
  grid:
    - component: oh-chart-grid
      config:
        includeLabels: true
  xAxis:
    - component: oh-time-axis
      config:
        gridIndex: 0
  yAxis:
    - component: oh-value-axis
      config:
        gridIndex: 0
  series:
    - component: oh-time-series
      config:
        name: Amps (Today)
        gridIndex: 0
        xAxisIndex: 0
        yAxisIndex: 0
        type: line
        item: HomeEnergyMeter_Electricmeteramps
    - component: oh-time-series
      config:
        name: Amps (Yesterday)
        gridIndex: 0
        xAxisIndex: 0
        yAxisIndex: 0
        type: line
        offsetAmount: 1
        offsetUnit: day
        item: HomeEnergyMeter_Electricmeteramps
  tooltip:
    - component: oh-chart-tooltip
      config:
        confine: true
        smartFormatter: true
  legend:
    - component: oh-chart-legend
      config:
        bottom: 3
        type: scroll
  dataZoom:
    - component: oh-chart-datazoom
      config:
        type: inside
3

Have the same problems here. Wasn’t able to add multiple series with same item.
Would be a nice feature.

4

Check out the demo Page.
login credentials are demo:demo

2 Likes
5

Wow cool, I got it working :smiley: Many Thanks!!!
Main thing I had to change was xaxis from oh-time-axis to oh-category-axis, change series to oh-aggregate-series and add dimension1: hour

6

You can absolutely compare two time series, no need to be aggregates:

image
image844×728 18.8 KB

The trick is that you have to define two separate time axes on the same “grid”.
Then you assign the two series (day before and now) to each of these axes (with xAxisIndex 0 & 1), also giving the second series the proper offsetAmount & offsetUnit.

YAML for the above chart:

config:
  chartType: day
  label: Temperature Comparison
  sidebar: false
  visibleTo:
    - role:administrator
slots:
  dataZoom:
    - component: oh-chart-datazoom
      config:
        show: true
        type: inside
  grid:
    - component: oh-chart-grid
      config:
        top: "120"
  series:
    - component: oh-time-series
      config:
        gridIndex: 0
        item: FlowerCare_Temperature
        name: Now
        type: line
        xAxisIndex: 0
        yAxisIndex: 0
    - component: oh-time-series
      config:
        gridIndex: 0
        item: FlowerCare_Temperature
        name: Day before
        offsetAmount: 1
        offsetUnit: day
        type: line
        xAxisIndex: 1
        yAxisIndex: 0
  tooltip:
    - component: oh-chart-tooltip
      config:
        show: true
  xAxis:
    - component: oh-time-axis
      config:
        gridIndex: 0
    - component: oh-time-axis
      config:
        gridIndex: 0
  yAxis:
    - component: oh-value-axis
      config:
        gridIndex: 0

If you wanted to add the series from 2 days ago it would be similar, add an axis, assign a new series to this new axis.

1 Like
7

Thanks for this Yannick. Very useful.

I am however trying to do a MONTH comparison which seems to be a bit skewed:

image
image1917×846 51 KB

I am guessing this is due to the different number of days in each Month (28, 30 or 31).

Any ideas on how to “fix” this?

I though of using an initial period of 30 days - but this does not seem to be supported.

image
image1457×445 12.4 KB

Any suggestions would be appreciated.