ApexCharts card - A highly customizable graph card

That would be decimalsInFloat: 1 (or any other number) in each yaxis entry.

1 Like

Wow thanks for the quick response. Works great

I would like to be able to display the state of an entity similar to what you see using show_states but I don’t want to display it as part of the graph and I don’t want to show the states of two other entities in the graph. Is that possible in any way?

That doesn’t seem possible for now.

So if I understand correctly:

  • you have 3 entities
  • 2 of which should be in the graph
  • 1 should be in the header

Am I correct?

Yes, that is exactly the setup I would like to achieve. Entity 1: current electricity price as header. Entity 2 and 3: price for remaining hours of today and tomorrow.

I see, for now I’d suggest you merge 2 cards together, like button and apexcharts-card using stack-in-card or vertical-stack-in-card to achieve that.

I’ll see what I can do to bake this into this card in the future. Best way for me to not forget is to open a feature request and reference this conversation in it on github. Thanks :slight_smile:

I’ll be checking this out once I get a chance. Making a comment so it shows up in my “new” posts and is easier to find.

Actually, don’t bother opening a feature-request, it’s there :smiley:

1 Like

@RomRider I am IN LOVE with this card! I have a graph intensive monitoring setup and this is the graphs I have been dreaming of. Thank you!

Here’s my dilemma:

y-axis is not auto-scaling itself to the corresponding inputs and thier espective range. I’ve even matched mine to @markcocker since his appears to be auto-scaling, but it is still not working.
Am I missing something simple here?

type: 'custom:apexcharts-card'
graph_span: 168h
header:
  show: true
  title: test
series: 
  - entity: sensor.r2t1a_temperature
    name: temp
    group_by: 
      func: avg
      duration: 10min
  - entity: sensor.r2t1a_moisture
    name: wc
    group_by: 
      func: avg
      duration: 10min
y_axis_precision: 0
apex_config:
  yaxis: 
    - seriesName: temp
      decimalsInFloat: 1
      opposite: true
    - seriesName: wc
      decimalsInFloat: 1

2021-02-01

Don’t use seriesName in yaxis and I think it should start to work.

Removing seriesName caused it to only show one yaxis for one value…
What I’m trying to accomplish is like this graph you made in your first post here. how “website” and “social media” both have thier own yaxis that are individually scaled to each data input. It’s a really great look, and according to apexchart docs it should autoscale like that, but I’m not sure why mine is not.
mis3rofp

Are you using the latest beta? If not, I’d suggest you try that first :slight_smile: I’ve fixed a bunch of stuff there

I am not! I will try it, thanks for the responses. I am really really enjoying this more than anything else on hacs.

Thanks @RomRider, simple when you know how!

I have specified option extend_to_end: false for the 1st series in the following chart but it doesn’t seem have taken effect. It does work on the other 2 series in the same chart. I’m using apexcharts-card 1.3.0.

Configuration
type: 'custom:apexcharts-card'
header:
  show: true
  title: Water and radiator over 24 hours
series:
  - entity: sensor.eddi_water
    show:
      legend_value: false
    name: Water
    curve: smooth
    extend_to_end: false
    group_by:
      func: max
      duration: 30min
  - color: grey
    show:
      legend_value: false
    curve: stepline
    name: Immersion
    entity: sensor.eddi_immersion
    type: area
    group_by:
      fill: zero
    extend_to_end: false
  - entity: sensor.eddi_heater
    show:
      legend_value: false
    color: red
    curve: stepline
    type: area
    group_by:
      fill: zero
    extend_to_end: false
span:
  start: day
apex_config:
  legend:
    show: true
    position: top
  yaxis:
    - seriesName: Water
      decimalsInFloat: 0
      title:
        text: Celsius
    - seriesName: Immersion
      opposite: true
      decimalsInFloat: 0
      title:
        text: Watt
  stroke:
    width: 3
  chart:
    type: line
    zoom:
      type: x
      enabled: true
      autoScaleYaxis: true
    toolbar:
      show: false
      autoSelected: zoom

Code for this? :smiley:

Please format your code, I can’t say if there’s something wrong or not in your config.
Thanks :slight_smile:

I’ve updated my post above with the configuration using the pre-formatted tags so hopefully more readable now.

So actually, the Water line doesn’t extend to the end of the graph in your case if you look closely, which seems to mean that there is something in the (future) history which is already in the database.

Not sure how that would end up there though. Do you know how to check the content of HA’s DB? If yes, I’d suggest that you look for values in the future in there.
Also, don’t provide the apex_config.chart.type value. That overrides some defaults.

Home Assistant History for this sensor shows only data up to current time (ie. no erroneous future information in the history):


If I remove the group_by configuration the line does not extend into the future (however the grouping is useful to ignore gaps in the data):

group_by:
  func: max
  duration: 30min


but with the group_by configuration the line does extend into the future: