ApexCharts card - A highly customizable graph card

Your sun.sun entity is probably excluded from the recorder and thus has no history

1 Like

I have tried it but the Utility Meter is only stored for 10 days like the other sensors, so I need the long term statistics in order to show consumption / month for the last year and even to show the last 30 days. But if you find a way of doing this, please let me know :slight_smile:

1 Like

Since yesterday I have a error:
/// apexcharts-card version 2.0.1 /// value.all_series_config is not a ChartCardAllSeriesExternalConfig; value.all_series_config.extend_to_end is extraneous

To my knowledge I haven’t changed anything

type: custom:apexcharts-card
graph_span: 24h
span:
  start: day
header:
  show: true
  title: Ticker - BTC-EUR 24hr
  show_states: false
  colorize_states: true
now:
  show: true
apex_config:
  legend:
    show: true
all_series_config:
  curve: straight
  unit: EUR
  fill_raw: last
  stroke_width: 2
  extend_to_end: false
  float_precision: 0
  group_by:
    func: avg
    duration: 30min
  show:
    legend_value: false
series:
  - entity: sensor.bitvavo_total_asset_value_eur.....

anybody else having these issues?

Have a look in the release notes, extend_to_end has been replaced with extend_to.

4 Likes

:+1: thanks

Ah sorry I thought utility meter sensors had been added to the long term statistics by default with the update
I did see @RomRider is thinking of possibly adding Influxdb support which would do it.
I did try Influxdb but I missed having the more-info and history as changed back.

Would it be possible to add “type: diff” to the statistics funtionality? I guess it would solve the problem.

Sounds like that is what is missing, not implemented now but I think RomRider is working on something :slight_smile:

I also have a xaxis-positioning and 0-value issue with the statistics functionality.

It’s working fine with “group_by”:

2022-04-27 13_22_52-Übersicht – Home Assistant

type: custom:apexcharts-card
graph_span: 365day
span:
  end: month
color_list:
  - var(--label-badge-green)
header:
  show: true
  title: kosten | monat
  show_states: true
  standard_format: true
  colorize_states: true
series:
  - entity: sensor.ifx_goe_costs_total_year
    type: column
    name: kosten
    float_precision: 2
    show:
      datalabels: true
    group_by:
      func: diff
      duration: 30day
      fill: zero
yaxis:
  - min: 0
    max: ~45
    decimals: 0
    apex_config:
      tickAmount: 5
apex_config:
  plotOptions:
    bar:
      columnWidth: 75%
  xaxis:
    tooltip:
      enabled: false
card_mod:
  style: |
    #state__name, .apexcharts-xaxis-label, .apexcharts-yaxis-label {
      font-size: 1em !important;
    }

The same data is shown like this with “statistics”:

2022-04-27 13_23_01-Übersicht – Home Assistant

type: custom:apexcharts-card
graph_span: 365day
span:
  end: month
color_list:
  - var(--label-badge-green)
header:
  show: true
  title: kosten | monat
  show_states: true
  standard_format: true
  colorize_states: true
series:
  - entity: sensor.goecharger_costs_monthly
    type: column
    name: kosten
    float_precision: 2
    show:
      datalabels: true
    statistics:
      type: state
      period: month
      align: start
yaxis:
  - min: 0
    max: ~45
    decimals: 0
    apex_config:
      tickAmount: 5
apex_config:
  plotOptions:
    bar:
      columnWidth: 75%
  xaxis:
    tooltip:
      enabled: false
card_mod:
  style: |
    #state__name, .apexcharts-xaxis-label, .apexcharts-yaxis-label {
      font-size: 1em !important;
    }
1 Like

Thank you, that was very helpful! I managed to get it to display a graph but I had to set it to 2days minimum, if I set it to 1day the graph turned up empty.

group_by:
  func: diff
  duration: 2day
  fill: zero

So it feels like a workaround and I’m still hoping for a way to get it done properly “out of the box” :slight_smile:

However, fixing this makes MOBILE app go all sentimental asking for extend_to_end back with /// apexcharts-card version 1.10.0 /// error :frowning:

That’s because your phone still runs an old cached version. Clear the cache of the app and it will be alright.

1 Like

It’s on its way :slight_smile:
I’ll release a beta later today and you’ll tell me if that works as I don’t have such a sensor to test with.

1 Like

Will do! :slight_smile:

Thank you stigvi for providing this example! I have been struggling with the exact same thing for weeks. Now I finally got it to work!

Hell together,

I made a chart for fuel price. This is how it looks:

My code:

type: custom:apexcharts-card
header:
  show: true
  title: E10
  show_states: true
  colorize_states: true
series:
  - entity: sensor.aral_drausnickstrasse_60_super_e10
    name: Aral Drausnick
    curve: stepline
  - entity: sensor.aral_kleinsendelbacher_str_12_super_e10
    name: Aral Neunkirchen
    curve: stepline
  - entity: sensor.elo_leitenackerstrasse_1_super_e10
    name: Elo Uttenreuth
    curve: stepline
    show:
      extremas: true
  - entity: sensor.supol_artilleriestr_58_super_e10
    name: Supol Erlangen
    curve: stepline
    show:
      extremas: true
apex_config:
  decimalsInFloat: 3

I would like to have it with 3 digits like in the detail picture.

Can anybody help me?

Best regards,
Stefan

I’m not sure but do you need to put it in the y axis like this

apex_config:
  yaxis:
    show: true
    decimalsInFloat: 3

Hello,

I have added my fireboard temperature probe added to home assistant. I have installed Apex Charts and have one chart setup to read the temperature for when I BBQ or cook other food. I also have a new smoker coming that has this Fireboard built into it and will be added when that arrives.

For now I’m learning about Apex Charts and seeing what is possible. Does anyone know if I can have an input for Target temperature of a probe and have that added to the chart? Maybe have it show up as a red line and when that temperature is reached it can send my phone a notification.

This is what I have so far with an Ambient outside temperature from local weather METAR. Fireboard Probe 1 was my smoker pit temperature at the grate. And Fireboard Probe 2 was the brisket.

Here is the config for my apex chart. I added the red Now (not on the picture).

type: custom:apexcharts-card
graph_span: 1.5h
now:
  show: true
  color: red
  label: Now
header:
  show: true
  title: Fireboard History .!|!.
  show_states: true
  colorize_states: true
series:
  - entity: sensor.kxx_temperature
    name: Ambient (Outside)
  - entity: sensor.fireboard.temp.channel.1
    type: area
  - entity: sensor.fireboard.temp.channel.2
    type: line

So you can see just real basic chart from 3 sensors. It would be cool to be able to show a line for a set target temperature. And somehow calculate a cook time from where the current temperature is showing how long to get to that set target temperature. This may not be possible with Apexcharts but with other Home Assistant stuff. I just don’t know where to look. Hopefully someone has ideas for this.

Thanks!

Apologies if this has been discussed but I could not find an example in this long topic… Has anyone done something like a donut that compares device power usage vs total power usage like this?

image

1 Like

THX, you are rigth. It works for y-Axis.
I tried it for header, but nothing

1 Like