Hi,
I have a sensor (Beaufort Index Description) that sends text strings instead of numbers.
Is possible to put this sensor as chart title (it vary based on the Beaufort Index)?
i had a solution but was not best one. Used input_text but when you enter a wrong value the the whole stats become infected. Would be nice to have a option to select a entity that will only show the value as static point in middle of screen or creates a straight line (then the entity you use remove from recorder/history)
How can I get my Y-axis to correspond to the min max values?
Have tried lots of stuff, but nothing which will auto adjust, Yes, I can set the min/max - but I want it to adjust itself. So I can use this card for every place I have a temp gauge and humidity sensor, i.e outdoor will vary a lot more compared to indoor, so I won’t set a fixed min - max.
Also for the header title, would love to have it in center and with a bigger/bolder font…
Think I have tried almost everything I found on https://apexcharts.com/docs/
- type: 'custom:apexcharts-card'
header:
title: Indoor
show: true
show_states: true
colorize_states: true
update_interval: 10min
graph_span: 7d
apex_config:
tooltip:
enabled: true
yaxis:
- show: true
decimalsInFloat: 0
#min: 17
#max: 30
#range: 20
#min: { return min }
#max: { return max }
labels:
style:
colors: '#FFB62E'
fontSize: 12px
fontWeight: bold
fontFamily: Raleway
forceNiceScale: true
- show: true
decimalsInFloat: 0
opposite: true
#range: 20
#min: 20
#max: 100
labels:
style:
colors: '#2eb9ff'
fontSize: 12px
fontWeight: bold
fontFamily: Raleway
forceNiceScale: true
xaxis:
axisBorder:
show: false
labels:
style:
fontSize: 14px
#fontWeight: bold
fontFamily: Raleway
chart:
height: 'auto'
grid:
show: false
#borderColor: '#404040'
#strokeDashArray: 3
#position: back
legend:
# show: false
fontSize: 12px
fontFamily: Raleway
height: 40
dataLabels:
enabled: false
stroke:
width: 3
curve: smooth
fill:
type: gradient
gradient:
type: vertical
shadeIntensity: 0.8
inverseColors: false
opacityFrom: 0.5
opacityTo: 0
stops:
- [0, 50, 100]
series:
- entity: sensor.netatmo_indoor_temperature
name: Temperature
show:
extremas: true
type: area
color: '#FFB62E'
fill_raw: last
float_precision: 0
group_by:
duration: 60min
func: avg
- entity: sensor.netatmo_indoor_humidity
name: Humidity
#opacity: 0
#show:
# extremas: true
type: area
color: '#2eb9ff'
fill_raw: last
float_precision: 0
group_by:
duration: 60min
func: avg
Hi @hreedijk
Yes, kinda - but with 24 series and only one value from each (the last value)
How did you get the above chart?
Thanks
Officially, you can’t compare data, but I believe that using:
graph_span: 1m
series:
- entity: xxx
type: column
group_by:
duration: 1m
func: last
It might work
My code, just adjust the number of days and add all your sensors to the series
type: 'custom:apexcharts-card'
graph_span: 13d
update_interval: 5m
cache: false
span:
end: day
offset: '-1sec'
header:
show: false
title: Kosten elektra en gas per dag
apex_config:
chart:
type: area
height: 350
xaxis:
labels:
format: dd-MM
show: true
showAlways: true
fill:
type: gradient
gradient:
shadeIntensity: 0.1
opacityFrom: 0.25
opacityTo: 1
inverseColors: true
stops:
- 0
- 90
- 100
yaxis:
forceNiceScale: false
decimalsInFloat: 0
legend:
show: false
series:
- color: 'rgb(138,43,226)'
entity: sensor.energy_total_dagelijks_eur
type: column
name: Kosten elektra
group_by:
func: last
duration: 24h
show:
datalabels: true
float_precision: 2
stroke_width: 1
- color: 'rgb(235,10,104)'
entity: sensor.energy_gass_eur
type: column
name: Kosten gas
group_by:
func: last
duration: 24h
show:
datalabels: true
float_precision: 2
stroke_width: 1
- color: 'rgb(105,226,69)'
entity: sensor.energy_export_total_dagelijks_eur
type: column
name: Opbrengst elektra
group_by:
func: last
duration: 24h
show:
datalabels: true
float_precision: 2
stroke_width: 1
- color: 'rgb(128,128,128)'
entity: sensor.energy_gas_en_elektriciteit_eur
type: column
name: Totaal
group_by:
func: last
duration: 24h
show:
datalabels: true
float_precision: 2
stroke_width: 1
Doesnt seem to quite work - with graph span and duration the same
And mostly works if graph span is larger
Thanks for the response - looks like not quite the intended use of this card
Edit: using 5m instead of 1m as that is the update frequency of the sensors, the result of 1m is the same as the first image
As per response to bacco007 trying to set up some COVID vaccination charts. I was planning to do the same for Finland. Data is no problem, nor plotting it in the graphs per se - bit rather how to set the right labels, as I have not immediately found a way to set the labels - preferably using a generator script in the same way as the data - or at all for that matter… All samples I have seen so far here is for plotting something time based.
Is it possible to give in own labels?
I have a plan to work on that, so bear with me
Should be fixed in the latest beta. Please report back.
What do you mean by multi-line legend?
You mean this kind of chart?:
If so, no, not yet. Open a feature request with your use case and I’ll see what I can do.
No, that is not a feature of the ApexCharts library unfortunately
You can’t at least not at the moment. Maybe I’ll introduce a feature for that, but ApexCharts is complex and I have to work around a bunch of stuff to make this possible…
You can use card-mod for that.
That is because in your data_generator
the first value’s timestamp is where the line starts. You can introduce the value of the other sensor as the first data point if you want to “merge” the end of the first line with the beginning of the second.
I’m not sure what you mean by the “other sensor” ?
I only use one sensor in this automation. Can you be more specific, please ?
Whether it’s the same sensor or another one is not relevant for my answer.
Share you’re config and I’m going to show you how to do it.
Sure, here it is:
type: 'custom:apexcharts-card'
graph_span: 6d
span:
start: hour
offset: '-36h'
header:
show: true
title: Temperature Forecast
show_states: true
now:
show: true
label: now
apex_config:
legend:
show: false
series:
- entity: weather.home
name: Temperature
unit: °C
attribute: temperature
fill_raw: last
extend_to_end: false
group_by:
func: avg
duration: 2h
- entity: weather.home
type: line
extend_to_end: false
unit: °C
show:
in_header: false
data_generator: |
return entity.attributes.forecast.map((entry) => {
return [new Date(entry.datetime).getTime(), entry.temperature];
});
And here’s the attribute list of my sensor:
temperature: 4.8
humidity: 76
pressure: 1005.2
wind_bearing: 316.9
wind_speed: 4
attribution: >-
Weather forecast from met.no, delivered by the Norwegian Meteorological
Institute.
forecast:
- condition: partlycloudy
precipitation: 0
precipitation_probability: 0
temperature: 6.2
templow: -1.3
datetime: '2021-03-21T11:00:00+00:00'
wind_bearing: 334.4
wind_speed: 20.5
- condition: cloudy
precipitation: 0
precipitation_probability: 0
temperature: 9.6
templow: -1.4
datetime: '2021-03-22T11:00:00+00:00'
wind_bearing: 194.9
wind_speed: 5.4
- condition: partlycloudy
precipitation: 0
precipitation_probability: 5.9
temperature: 9.7
templow: 0.1
datetime: '2021-03-23T11:00:00+00:00'
wind_bearing: 219.7
wind_speed: 11.2
- condition: partlycloudy
precipitation: 0
precipitation_probability: 11.8
temperature: 9.5
templow: 3.3
datetime: '2021-03-24T11:00:00+00:00'
wind_bearing: 211
wind_speed: 16.9
- condition: partlycloudy
precipitation: 0
precipitation_probability: 11.8
temperature: 9.3
templow: 1.9
datetime: '2021-03-25T11:00:00+00:00'
wind_bearing: 219.9
wind_speed: 12.6
friendly_name: Home
How can i make a graph with sum per hour ?
The calcluated value per hour is different compared to to sum of data from dat sensor in my DB.
Looks like i’m having trouble again with sensordata that stays the same for minutes.
Here is an example.
the hour graph (second graph) calculated 10w betwenn 23:00 and 00:00.
The minute graph ( first graph) shows the sum between 23:00 and 00:00 should be higer than 10 w. Looks like it’s only adding the value if it different from the previous value.
The code of the second grap ( sum per hour) is:
type: 'custom:apexcharts-card'
graph_span: 24h
locale: nl
span:
end: day
cache: false
header:
show: true
show_states: true
all_series_config:
type: column
group_by:
func: sum
duration: 1h
fill: last
series:
- entity: sensor.energy_power
name: power
color: red
fill_raw: last
- entity: sensor.energy_solar
name: solar
color: green
fill_raw: last
- entity: sensor.water_meter
name: water
color: blue
fill_raw: last
Is my code correct if i want the sum per hour for this day ?
Did i make another fu in the group_by part ?
group_by only works if there is enough state change to fill each bucket (= 1 column of length duration
). If there isn’t enough state change by default, it will reuse the data from the previous bucket (with fill: last
)
I don’t see anything wrong with the data shown on both chart. If you change to fill: zero
on the first chart, you’ll understand what i mean.
Also your first chart is not showing from 23 to midnight it’s displaying data from 22.20 to 23.20. Between 23.00 and 23.20 on the first chart, there seem to be 3 states change (3 + 4 + 3 which sums up to 10 as the second chart is showing)
The power sensor updates every 60 secondes and it is possible to have the same value for a few minutes of power usage in the house. ( it counts pulses on an kwh meter)
The correct sum of power usage per hour should be something like this example
23:00 -> 3w
23:01 -> 3w
23:02 -> 4w
23:03 -> 3w
23:04 -> 3w
Sum should read 16w during this hour column (3+3+4+3+3)
The group by hour give me 3+4+3 = 10w for the hour column.
I would like to have the unchanged value also added to the sum when it does’nt change. It means the power consumption that minute was 3 pulses the same as the minute before.
For example if in theory the power consumption is 3 pulses /minute for an hour without changing the sum would be 60x3 = 180. The group_by would saysum is 3w for those 60 entry’s of 3w
Seems like the history API of home assistant is not reporting consecutive state change with the same value. I’ll need to investigate… Is it even stored in HA’s database?
I think I know the problem… In the API significant_change_only defaults to true… But it’s not documented
See here
I’ll fix it.