Apexcharts with offset template not working for series

Third party integrations
1

I have a curious issue with the offset in the Apexcharts.
My goal:
I get data from a satellite 1.5 million km from earth. What the satellite measures arrives at earth approximately 45 min later, but I use a formula to calculate that.
In my Apexchart I place the now markerline this ~45min back by use a positive offset with a template on the span. That works seamless.
Now all the data in the series need to be adjusted with a negative offset of the same value.
When I type in the value in the offset at the series eg ‘-45min’ it works exactly as it should. but when I use the same template as I use for the span offset it doesn’t work.
Anyone having a brilliant idea to solve this?

type: custom:apexcharts-card
header:
  show: true
  title: EPAM Electrons
  show_states: false
  colorize_states: true
apex_config:
  yaxis:
    logarithmic: true
now:
  show: true
  color: red
  label: Earth
graph_span: 12h
span:
  offset: >
    +{{ ((1500000 / (states.sensor.solar_speed.state |float))/60) | round(0)
    }}min
all_series_config:
  stroke_width: 1
  offset: >
    -{{ ((1500000 / (states.sensor.solar_speed.state |float))/60) | round(0)
    }}min
series:
  - entity: sensor.solar_epam_stack
    attribute: electron_1_blue
    name: E1
    color: '#0000FF'
  - entity: sensor.solar_epam_stack
    attribute: electron_2_lightblue
    name: E2
    color: '#00FFFF'
2

I am not sure if I get all of this bu why not ‘offset’ the series themselves?
Example: I have a forecast that should (!) be at noon but arrives at 01:00 in the morning with that timestamp…so I just offset it with +11h and then it fits the timeline again

3

Thanks for your response. That is correct what you say.
If you look at the code you see that I have an offset at the series (‘all_series_config’)
The issue is that it works when I fill in ‘-45min’ or ‘-1h’. Then I see the graphs shifting on the x-axis.
However when I put a template in there, like you see now in the code, it doesn’t have any effect. Strange enough the template does work when you use it in the span offset (see also code above)

4

I am suimng templates inside a config-template-card or config-templater (2 card are av.)… do you do the same thing? Use of templates is not always available everywhere

5

It looks indeed that templates are not available for everything. What just caused my curiosity that the templating works in one section of the Apexcharts and not in another section.

6

Try with one of the two I suggested

7

Thanks, will give that a try tonight and let you know the outcome at the end

8

As promised I would give some feedback on the solution with config-template-card.
I found out that also then you can not use formulas to calculate a value for a variable. But ofcourse you can use sensor data to have that as variable and use it in the apexcharts.
So I decided to create a sensor “sensor.solar_travel_time” that calculates the value via a template. The value of this new sensor is read into a variable “offset” and used as offset value in the apexcharts’ span and all_series_config.
This works like a charm.
Next steps is optimizing the graph layout and find a way to present scientific notations at the y-axis as it now blows displaying values like 10000000.
Collecting data now and will post a screenshot when it looks pretty.

type: custom:config-template-card
variables:
  offset: states['sensor.solar_travel_time'].state
entities:
  - sensor.solar_travel_time
card:
  type: custom:apexcharts-card
  header:
    show: true
    title: EPAM Electrons
    show_states: false
    colorize_states: true
  apex_config:
    chart:
      height: 200px
    yaxis:
      logarithmic: true
  now:
    show: true
    color: red
    label: Earth
  graph_span: 12h
  span:
    offset: ${'+' + offset + 'min'}
  all_series_config:
    stroke_width: 1
    offset: ${'-' + offset + 'min'}
  series:
    - entity: sensor.solar_epam_stack
      attribute: electron_1_blue
      name: E1
      color: '#0000FF'
    - entity: sensor.solar_epam_stack
      attribute: electron_2_lightblue
      name: E2
      color: '#00FFFF'
9

Great… you can do all sorts of nice stuff with these cards, I have f.e. a card that uses input number to set an offset so I can compare to day with e.g. 1.2.3.4 etc. days back (e.g. for energy consumption, weather, etc.

1 Like
10

This is how it now looks like. Because communication to the satellite (1.5 km from earth) sometimes fails, there are some gaps in the data.
Basically at the right is what is now observed by the satellite. The marker earth is where the solar wind reached earth (in this example it is 67 min later)

One pity is that the nightstate can not be displayed in an graph where a logarithmic scale is used. The same happens in the mini-graph. When logarithmic scales are used it can only display lines.
Electrons