ApexCharts card - A highly customizable graph card

Is the buy/sell information available in a sensor/entity?

The Buy/Sell information comes from a JSON file from my exchange broker (Bitcoinmeester)
Here are all crypto coins with buy/sell information.

So I need something to do. Or update the template sensor with information. Or search for a other solution.
I have 164 of those sensors:

    eur_ada:
      value_template: "ok"
      friendly_name: "ADA"
      attribute_templates:
        buy: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.buy }}
        sell: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.sell }}
        change24h: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.change24h }}
        volume24h: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item. volume24h }}

I can add a new attribute:

    eur_ada:
      value_template: "ok"
      friendly_name: "ADA"
      attribute_templates:
        bought: "0"
        buy: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.buy }}
        sell: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.sell }}
        change24h: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item.change24h }}
        volume24h: >-
          {% set item =  state_attr('sensor.bitladon_all', 'result') | selectattr('ticker', 'eq', 'ADA') | first %}
          {{ item. volume24h }}

And update this one in a automation. If it is possible to update a sensor information

This is very interesting! I was already looking at grafana, but maybe this is enough for what I want.
Just want to say thanks you for your effort and nice initiative, I’ll definitely going to play with your card.

ls. you should merge your card with the mini-graph-card from kalkih and work together :grinning:

Cheers!

I’ve discussed with @kalkih and mini-graph-card is probably going to end up being in “maintenance mode” (only fixing issues and keeping compatibility with upcoming HA release). This card has most of the features of mini-graph-card already (and more).

1 Like

Any update on this?

Is anyone can suggest how to visualize six powerplugs Watt consumption per day
as fallow:
14 each day stacked column of all six plugs
and 24h linechart sumary of all, reseting from zero at midnight.

It’s a bit more tricky than expected and I want to resolve https://github.com/RomRider/apexcharts-card/issues/110 at the same time. HA’s history API isn’t giving me the option I’d require to make it work properly so I’ll have to hack around it.

Hello,
allow me to say that thic card is magnificent, I’ve been playing with it for weeks now and are getting the graphs visualized as I would like them.
I got one question, I’d like the grid bordercolor to change automatically with the theme when it becomes dark and light.
I’ve tried to enter a variable but that doesn’t seem to work. I just removes the grid.
Any idea?
The lines of code I’m using:

grid:
  show: true
  borderColor: 'var(--dwains-theme-primary)'
  strokeDashArray: 4
  position: back

Did you open a feature request for this?

Just wondering as I see the same thing using your card setup.

It’s already available in the latest release. Check the release notes.

That’s already happening, not sure I understand.

Hi, hope anyone can help me with this one. I`m trying to dynamically / programmatically set the graph span in this way:

                graph_span: >
                        {%- time = (as_timestamp(now()) - as_timestamp(states.binary_sensor.bbq_probe_1.last_changed)) | int  %}
                        {%- minutes = ((time % 3600) // 60) %}
                        {%- minutes = '{}m'.format(minutes) %}
                        {{ minutes }}

The template tool now returns ‘90m’ so that’s ok. The chart however throws an error:

is not a valid range of time

If i set the the last part of the code to this:

                        {%- time = (as_timestamp(now()) - as_timestamp(states.binary_sensor.bbq_probe_1.last_changed)) | int  %}
                        {%- minutes = ((time % 3600) // 60) %}
                        {%- minutes = 90m %}
                        {{ minutes }}

Everything works fine, and the graph shows the last 90 mins. What am i not understanding?

Jinja templates are not supported.

Is it possible to remove the percentage numbers out of a donut graph and insert the real data number?
DonutGraph

I managed to secure a sensor with the following json state:

data: >-
  099|14:00 104|14:05 092|14:10 077|14:15 000|14:20 000|14:25 000|14:30
  000|14:35 000|14:40 000|14:45 000|14:50 000|14:55 000|15:00 000|15:05
  000|15:10 000|15:15 000|15:20 000|15:25 000|15:30 000|15:35 000|15:40
  000|15:45 000|15:50 000|15:55 

the first part is the data part, the second is time in HR:MIN. Could this be used as input to the data_generator?

Hey RomRider thanks very much for the very cool chart. This chart is excactly what I am waiting for so long.
I display Day/Night in the charts. Is it possible to hide the legend for only this value (color grey)?

Here my chart
HideLegendValue

and here the code

type: 'custom:apexcharts-card'
graph_span: 5d
header:
  show: false
  title: '     Temperatur'
  show_states: false
  colorize_states: true
  standard_format: false
  floating: true
series:
  - entity: sensor.aussen_im_schatten_temperatur
    name: Schatten
    type: area
    color: 'rgba(245, 142, 15, 1)'
    opacity: 0.2
  - entity: sensor.aussentemperatur_in_der_sonne
    name: Sonne
    type: area
    color: 'rgba(255,255,0,0.30)'
    opacity: 0.2
  - entity: sensor.gewachshaus_temperatur
    name: Treibhaus
    type: area
    color: 'rgba(10, 100, 2, 0.7)'
    opacity: 0.2
  - entity: binary_sensor.nacht
    transform: 'return x === "on" ? 1 : 0;'
    name: ' '
    type: area
    color: grey
    opacity: 0.2
    stroke_width: 0
    curve: stepline
    group_by:
      func: min
    show:
      legend_value: true
      in_header: false
      name_in_header: false
      datalabels: false
all_series_config:
  stroke_width: 1
apex_config:
  chart:
    offsetX: -50
    width: 114%
  yaxis:
    - labels:
        show: false
      seriesName: Treibhaus
    - labels:
        show: false
      seriesName: Treibhaus
    - labels:
        show: true
        offsetX: 0
    - max: 1
      labels:
        show: false
  legend:
    offsetX: 20
    show: true
    showForZeroSeries: true
  type: area

ok thx
I’ll just have some patience, call me when you have the workaround pls
thx

Hello! How i may get multiline legend? I try formatted function, but this not work for me…
Or i need hide series when header click…

Hi, are timeline charts supported? I gather this would involve pairs of dates instead of date and value.

Capture

Is there a way to make the ticks match the group by value. Ticks here are showing every 10 minutes but my group by duration is 5 minutes.

Hi

I’ve looked through all these posts, but haven’t found a similar situation

I have multiple sensors that I’d like to display as bars or columns (just the last value). Ie one bar for each sensor (I’m monitoring the cells in my off grid battery)

Any hints or suggestions on the way to approach this?

Thanks