ApexCharts card - A highly customizable graph card

[vingerha]

Thanks but not exactly what I am looking for. I would like to have ‘conditional’ coloring but it was already a long shot. With your solution I can at least color the ‘limit’ red

[uiguy]

issue seems to be with Chrome and Firefox. On Edge the graphs are displaying correctly

[hari-bo]

I’ve already got an entity which calculates the average value, how can i add the following sensor to your vertical stack. Because removing - ‘y’: ${average} and change to - ‘y’: ${sensor.nordpool_today_average} wont work.

[complex1 (Frank)]

Do not change anything in the Apexcharts card, but try it with this:

type: vertical-stack
cards:
  - type: custom:config-template-card
    entities: sensor.nordpool
    variables:
      average: states['sensor.nordpool_today_average']
    card:
      type: custom:apexcharts-card

[hari-bo]

If i add the line the apexchard is gone, when i remove state i see the following without the correct value at the moment

sensor.nordpool_today_average

[complex1 (Frank)]

This is silly…
Replace the variable “average:” “states[‘sensor.nordpool_today_average’]” and change it in eg. “48”
Now you should see a line on 48.0
If not, then you have to check if everything is properly copied from my example.

type: vertical-stack
cards:
  - type: custom:config-template-card
    entities: sensor.nordpool
    variables:
      average: 48 # change this
    card:
      type: custom:apexcharts-card
      [...]

[magiva]

does anyone know if its planned to implement
reverseData: true
horizontalBars: true
So that i can have hours top to bottom with data values going from left to right ?

[hari-bo]

I’ve rebooted the nas and it works fine now, thanks!

[Con (Con van Doornik)]

I have 2 questions;
How do I configure the vertical gridlines.
And is it possible to get 2 entities in the same place (column).

[Kertz1954]

See my post above with windmolens as a background. It has a brief grid section and also covers stacked columns. More info for all options can be found here

[HA_n00b]

I could make horizontal bar (column), but I still can’t figure out the rests, like swapping Y and X entities.
Hopefully someone else knows.

apex_config:
  plotOptions:
    bar:
      horizontal: true
      columnWidth: 80%
  dataLabels:
    enabled: true
    textAnchor: middle
    dropShadow:
      enabled: true
    offsetY: -12
    style:
      fontSize: 12px```

[sorted]

Hello,
starting to use ApexCharts. Spend a lot time in the thread and with searching.
Can someone help we.
Can I increase the textsize of the current states:

Thank you

[HA_n00b]

How to use if then else in a formatter function? The below code works, but some of the data value might be not available / undefined, so the tooltip will display NaN.

I want to catch that NaN, and convert it to 0.

Anyone can help?

apex_config:
  tooltip:
    enabled: true
    'x':
      format: MMM dd
    'y':
      formatter: |
        EVAL:function(value) {
        let text = parseFloat(value).toFixed(3);
        let result = text.replace(".", ",")+" m3";
        return result;
        }

SOLVED the issue by adding fill: zero in the group_by:

series:
  - entity: sensor.helper_gas_consumption
    type: column
    float_precision: 3
    fill_raw: zero
    group_by:
      fill: zero
      func: last
      duration: 1d

Then catch the value in the datalabels formatter:

  dataLabels:
    enabled: true
    formatter: |
      EVAL:function(value) {
      if (value == 0) {
        return " ";
      }
      return value;
      }

[HA_n00b]

@Lunkobelix I solved the yaxis stacked max auto by adding this code:

apex_config:
  yaxis:
    forceNiceScale: true
    min: 0
    max: |
      EVAL: function(max) { return max }

[Con (Con van Doornik)]

Unfortunately, that’s not what I mean, what you have is stacked vertically

[ArveVM]

Hi
Sorry for digging up such an old post, but I’m browsing throughout the forum to increase my knowledge on Apex, and see that you are able to combine bars and line with the line in front of the bar.
Can you please share config of that card (if you still have it), so I can see the magic that I’ve missed

[Con (Con van Doornik)]

Thanks @Kertz1954 for your link but the situation is as follows;
i have 4 entities;

• Sun,
• own use,
• consumption (net) and
• production (net)
  There is always either consumption or production.
  So I want consumption and production as stacked column.
  And “sun” and “own use” in a normal column.
  Is that possible?

[Kertz1954]

Unfortunately you cannot have a mixture of stacked or not stacked in the same chart.
I also believe you are looking for a horizontal type column/bar chart based on your previous reply to my earlier response.
This is not supported with the current version of the Home Assistant ApexCharts card.

[ArveVM]

Added bonus of using ‘new’ Template is that you can reload them without restarting HA

[ArveVM]

@Lunkobelix

only available for a week

I guess that is true:

• if you have recorder set to purge 7days,
• and your sensor is not configured as long term statistics.

You can configure your template-senors as long term statistics, and then get long term data stored.

I have configured a bunch which I’ve used custom history explorer card to show, but now looking to dive into a Apex hole as well

Long- and short-term statistics | Home Assistant Data Science Portal