Maybe not a direct solution to your question but how I’ve done similar using a donut chart for my power. The total label is what I’ve used in the centre and then the javascript is to set the style and apend the units.
If your entity isn’t giving you the TB, you could use this area to ‘do maths’ on the % to give a TB value.
Alternatively, you could embed the apex chart in to a custom:config-template-card so that you can define your TB entity as a variable, then potentially use that in the label.
Hello. I’m trying to do exactly what you did here, I have the entity that gives me the total, I have several entities that shows instant power and I would like to create that “Other” that calculate Total - Individuals.
Can you share the complete code for this graph please?
Thanks!
Thanks for taking the time to reply @alexeiw123 ! I do have an entity “sensor.volume1_space_used” which does provide the TB.
Based on your suggestion I’ve tried the below, but it does not return anything
formatter: >-
function (w) { return
'${states['sensor.volume1_space_used']}' }
I’ve read through the docs and this thread, and see a few others have asked similiar questions, but no working examples - other than the “total” approach which you have shared.
…perhaps just not possible, and I may just need to change my approach.
thanks again!
Thanks vingerha for the info. I checked the thread, but I could only find people asking for this feature. Maybe if they solved the issue, didn’t wrote back (or I didn’t find the solution at least)
So @Lunkobelix@RomRider did you manage to solve the long-term statistics to show up in apex charts?
Thanks!
No worries - I use a template sensor to workout the ‘other’ power from my whole of house monitoring minus the other loads that I’m reporting on individually. Simplified the code for you here.
template:
sensor:
- name: unmonitored power
unit_of_measurement: "W"
device_class: power
state_class: measurement
state: >
{% set cons = states('sensor.consumption') | int(default=0) %}
{% set load1 = states('sensor.load1') | int(default=0) %}
{% set load2 = states('sensor.load2') | float(default=0) %}
{% set load3 = states('sensor.load3') | float(default=0) %}
{% set loadx = states('sensor.loadx') | float(default=0) %}
{% set all = (load1 + load2 + load3 + loadx) | int(default=0) %}
{{ max(cons - all,0) }}
Here’s my config for that donut chart exactly as I use it. You’d obviously need to change the sensors, sizes etc. to suit your dashboard
I’ve got no skills using javascript - I mostly found other examples then stumbled by my way through to got it to do what I want.
That said, I don’t think that you can call a HA sensor in the javascript, but I do think that javascript accepts variables. To set a javascript variable, you need to use custom:config-template-card, define the variable, then put your apex chart within that template card, and use the variable in the javascript part.
It’s probably easier if you just use the ‘total’ approach like in my example, and use entities that give the total view. You could use a template sensor to work out the unused percentage, or the used and unused storage capacity.
Other way is to manipulate the value in the javascipt to display as you want it. In my example, I use / 1000, to show kW rather than W. You could calculate the storage being used from the total volume and the percentage there, then append the appropriate units. I’ll leave it to you to figure out how, because I’d only be fumbling around to get to the end result anyway.
Could someone please help me with whats going on here?
I have two series that I’m charting, but when then second series is showing 0 values, it is being displayed incorrectly… any ideas?
Also you’re using the function diff, whcih could be related: Will return the difference between the last and the first entry in the bucket. Do you need to be using group_by for this graph?
type: custom:apexcharts-card
apex_config:
chart:
height: 200px
update_interval: 15s
graph_span: 24h
header:
show: true
title: Stato Inverter
show_states: true
colorize_states: true
all_series_config:
stroke_width: 2
series:
- entity: sensor.growatt_grid_voltage
type: line
name: Voltaggio di rete
- entity: sensor.growatt_temperature
type: line
name: Temperatura inverter
- entity: sensor.growatt_status_state
name: Stato inverter
show:
in_header: raw
in_chart: false
- entity: sensor.growatt_fault_code
name: Codice errore inverter
show:
in_header: raw
in_chart: false
As you can see the fault_code and status_state entities are showing as NaN. I guess this is because the entity value is not numeric… Indeed that values are strings like “all good” or “AC voltage too high”
Now my question is, is it possible to show in the card any string entity to not be projected into the chart itself?
Asking about color_threshold in a radialBar chart, knowing full well it’s an experimental feature. The outer bar shows temp, and the inner bar shows humidity:
The value of sensor.current_temperature_basement is 71. The value of sensor.baseboards_basement_humidity is 49. I would expect the color of the both outer and inner bars to be green. Am I understanding this incorrectly, is it configured incorrectly, or should I chalk this up to the experimental feature just working incorrectly?
EDIT: I had the idea to turn on dataLabels value to see what it’s displaying. The inner bar shows correctly at 49, but the outer bar shows “52.5%”? Ahh… it looks like the value it’s displaying is actually the % value of the sensor between the min and the max. If the min is 50 and the max is 90, the value it’s displaying at 71 is 52.5%. That’s why the humidity bar shows correctly (min = 0, max = 100).
So… it’s the chart, not me. I guess I could fix it with some template sensors created specifically for the colors I want to see in the chart if I wanted to…
EDIT 2: Meh… I just fudged the values specified under color_thresholds by converting them to percentages between my min & max. I don’t like it, but it looks the way I want it to in the front end.
(or I didn’t find the solution at least)
