that works
my example was for yaml file. In case gui mode use that
type: custom:apexcharts-card
header:
show: true
show_states: true
colorize_states: true
experimental:
color_threshold: true
series:
- entity: sensor.your_sensor
type: line
stroke_width: 3
color_threshold:
- value: 20
color: cyan
- value: 30
color: yellow
- value: 100
color: red
extend_to: now
show:
header_color_threshold: true
span:
offset: +1min
apex_config:
tooltip:
followCursor: true
x:
show: false
xaxis:
tooltip:
enabled: true
grid:
show: false
graph_span: 1h
now:
show: true
label: now
color: red
show:
last_updated: true
loading: true
@RomRider love your work
Just wondering whether you still maintain a backlog feature/wishlist? I know you’ve done this in the past. Adding Home Assistant local / server timezone support would be great as there seems to be plenty of interest in it.
Here is an example of the problem using the Sun2 integration. This apexchart is viewed locally, in the same timezone as the Home Assistant server. The sunrise is shown correctly
Here is the same apexchart, viewed at the same time but from a different timezone from the Home Assistant server. You will not the sunrise is not shown correctly as the client time is used, rather than the server time.
How to change font size?
- type: custom:apexcharts-card
chart_type: donut
update_interval: 60s
apex_config:
legend:
show: false
dataLabels:
formatter: |
EVAL:function(value) {
return value.toFixed(1) + "%";
}
plotOptions:
pie:
donut:
size: 50%
labels:
show: true
total:
show: true
label: Total Power
formatter: |
EVAL:function(w) {
return w.globals.seriesTotals.reduce((a, b) => {return (a + b)} , 0).toFixed(2) + " W"
}
I’m trying to get my pie chart to show me the current used Wattage followed by the entity name.
type: custom:apexcharts-card
chart_type: pie
series:
- entity: sensor.stopcontact_wasmachine_huidig_gebruik
name: Aquarium
- entity: sensor.stopcontact_droogkast_huidig_gebruik
name: Droogkast
apex_config:
chart:
height: 300px
legend:
show: false
dataLabels:
enabled: true
style:
fontSize: 9px
I’ve tried for instance this code but I only get the percentage (followed by the requested ‘W’):
formatter: |
EVAL:function (val) {
return val.toFixed(0) + " W";
}
Does anyone here know how I can fix this?
Try:
type: custom:apexcharts-card
chart_type: pie
series:
- entity: sensor.stopcontact_wasmachine_huidig_gebruik
name: Aquarium
show:
datalabels: percent
- entity: sensor.stopcontact_droogkast_huidig_gebruik
name: Droogkast
show:
datalabels: percent
apex_config:
chart:
height: 300px
legend:
show: false
dataLabels:
enabled: true
style:
fontSize: 9px
This gives me the same result.
To clarify: I don’t want to know the percentages inside the pie chart.
I only want to see the actual Wattage followed by a W and the entity name.
Example: 73 W - Droogkast
Yeah… I misread… it took me a while to find this again but…
type: custom:apexcharts-card
chart_type: pie
series:
- entity: sensor.stopcontact_wasmachine_huidig_gebruik
name: Aquarium
show:
datalabels: percent
- entity: sensor.stopcontact_droogkast_huidig_gebruik
name: Droogkast
show:
datalabels: percent
apex_config:
dataLabels:
formatter: |
EVAL:function(value, opt) {
return opt.w.config.labels[opt.seriesIndex] + ":" + value.toFixed(1) + " W ";
}
and donot ask how this works …no clue, just copied it
Unfortunately this is what I get when I try your code:
I once saw something similar to your code (which did exactly what I wanted) but didn’t save it for now
I also don’t realy understand how the code works…
So you get the same result as me. When you add both values you get 100%.
There should be Droogkast: 153 W and Aquarium 124 W mentioned on the pie chart, the same values as shown in the legend.
I just want to hide the legend (for a cleaner look imo) and get those values in the chart.
U vraagt wij leveren … I started to understand the code (a bit)
try this
apex_config:
dataLabels:
formatter: |
EVAL:function(value, opt) {
return opt.w.config.labels[opt.seriesIndex] + ":" + opt.w.globals.seriesTotals[opt.seriesIndex] + " W ";
}
Yes, that’s it!
Thanks a lot for your help vingerha
In your browser, click the left menu, choose your “profile” change Timezone to Server-time
How can I get rid of all this whitespace?
type: custom:apexcharts-card
chart_type: radialBar
apex_config:
chart:
height: 350px
fill:
type: gradient
gradient:
shade: dark
shadeIntensity: 0.15
inverseColors: false
opacityFrom: 1
opacityTo: 1
stopps:
- 0
- 50
- 65
- 91
plotOptions:
radialBar:
offsetY: 0
startAngle: -90
endAngle: 90
hollow:
size: 30%
stroke:
dashArray: 2.5
lineCap: flat
legend:
show: false
grid:
padding:
left: 0
right: 0
bottom: 0
header:
show: true
title: UnRaid
show_states: true
colorize_states: true
series:
- entity: sensor.192_168_1_145_mnt_disk1_used_percent
name: Disk Used
show:
in_header: true
legend_value: false
- entity: sensor.192_168_1_145_mnt_disk1_free
name: Disk Free
show:
in_header: true
in_chart: false
- entity: sensor.192_168_1_145_ram_used_percent
name: Memory
show:
in_header: true
stroke:
dashArray: 0
That’s the point, it doesn’t work!
ohh, sorry to hear, i haven’t really checked, because im running “local” so client/server is always the same
hi guys, I’m looking for a card like this, I copied the code directly from the official website but it doesn’t work, can anyone help me?