I am not sure but the order of total in time is reverse, so I guess it tries to connect the end with the start… check that maybe?
These are the last values of the series, 0,0, and 0.25 (=0.3), depending on what graph you use these have no added avlue, e.g. for running measurements ‘now’ yes…but for historical…less
Good catch let me check what happen when I have the same order.
Ah ok then it make sense. Can I show the entity value here instead of the last value of the series?
Not sure what that would be but this is one option
Header to provide option to show entity value at current time · Issue #86 · RomRider/apexcharts-card (github.com)
Ah nice thanks that is the option I want:
show:
in_header: raw
And the order fix the issue with the red line.
Thanks a lot
Hi all,
Entirely new to apexcharts card so silly question (that I can’t see has been answered, but forgive me if it has).
Is it possible to have distinct sensors form the x-axis? I’m looking at building something like this:
with the aim of displaying current values of sensors/helpers, maybe if I’m feeling fancy have shadow twin columns for ‘yesterday’ values.
I need a hand with aggregating data into buckets for a particular month, not just a time period 30 days.
FULL DETAILS
The below image shows 87.7mm for January. This is accurately added up in SmartMixn
CARD I WANT TO MAKE MORE ACCURATE
APEX CHARTS Monthly Rain Fall Graph
I am using the Rain Per Hour Sensor. It is close but not quite right because of the uneven shift of data over the month. Using the long term statistics option in this card is key.
The below graph shows 82.3 for January, because of the shift in data, and being on the 12 June Currently (Last 30 days is not in line with the months)
- type: custom:apexcharts-card
graph_span: 365d
header:
show: true
title: Monthly Rainfall
show_states: false
apex_config:
fill:
type: gradient
gradient:
type: vertical
shadeIntensity: 0.0
opacityFrom: 1
opacityTo: 0.5
stops: 10
chart:
height: 150px
grid:
show: false
borderColor: darkslateblue
strokeDashArray: 2
dataLabels:
background:
borderWidth: 0
opacity: 0
foreColor: white
offsetY: -10
plotOptions:
bar:
borderRadius: 0
dataLabels:
position: top
span:
start: month
offset: '-334.5833333333333d'
series:
- entity: sensor.netatmo_devonport_tas_indoor_rain_rain_last_hour
color: deepskyblue
type: column
group_by:
func: sum
duration: 30.41666666666667d
fill: zero
statistics:
type: state
period: hour
align: end
show:
name_in_header: false
datalabels: true
Is it possible to show the minimum value of the Serie in the header?
I managed to fix the graphs:
See the link below for the full code.
@MelleD following the above, yes you can show the minimum value in the header, you will need to put a second series in your chart and hide it. The value can then be shown in the header.
Ok thanks. I will try that
hello can you post code?
Tell me how to remove the names of the sensor when showing the state of an object?
Hi there.
I need help with filling the stepline with solid color, if the boolean enitity is 1. Any recommendations?
type: custom:apexcharts-card
experimental:
color_threshold: true
graph_span: 2h
apex_config:
chart:
height: 100px
header:
show: false
title: Main Boiler
show_states: false
colorize_states: true
series:
- entity: input_boolean.jablotron_motion_detector_all
transform: 'return x === ''on'' ? 1 : 0;'
curve: stepline
invert: false
stroke_width: 2
yaxis:
- show: false
apex_config:
tickAmount: 1
hello can you send me this code?
hello this is my code, how I can set a theme?
type: custom:apexcharts-card
experimental:
color_threshold: true
graph_span: 14h
show:
last_updated: true
span:
start: day
offset: +5.5h
header:
standard_format: false
show: true
show_states: true
colorize_states: false
title: Fotovoltaico
yaxis:
- min: 0
max: auto
decimals: 0
apex_config:
tickAmount: 15
series:
- entity: sensor.somma_produzione_attiva_2_impianti_in_w
show:
header_color_threshold: true
extremas: true
type: column
group_by:
func: avg
duration: 1m
color: 0cb005
series:
show:
name_in_header: false
series:
- entity: sensor.netatmo_devonport_tas_indoor_rain_rain_last_hour
color: deepskyblue
type: column
group_by:
func: sum
duration: 30.41666666666667d
fill: zero
statistics:
type: state
period: hour
align: end
show:
name_in_header: false
datalabels: true
Hi all, I’m trying to replace my solar forecast integration and it presents data in a totally different way. I’m struggling to work out how to extract the hourly forecasts for my apexcharts-card graph. Here’s the code I’m using currently for Solcast:
data_generator: |
var today = entity.attributes.detailedForecast.map((start, index) => {
return [new Date(start["period_start"]).getTime(), entity.attributes.detailedForecast[index]["pv_estimate"]];
});
var data = today
return data;
Here’s the new attribute data I need to modify this for (truncated):
wh_period:
'2024-06-19T00:00:00+01:00': 0
'2024-06-19T01:00:00+01:00': 0
'2024-06-19T02:00:00+01:00': 0
'2024-06-19T03:00:00+01:00': 0
'2024-06-19T04:00:00+01:00': 1.25
'2024-06-19T05:00:00+01:00': 128.5
Any help would be appreciated!
EDIT: Looks like this does the trick:
data_generator: |
return Object.entries(entity.attributes.watts).map(
([key, value]) => [new Date(key).getTime(), value / 1000.0]
);
I feel kinda stupid for not being able to find a solution/earlier mention of this, but how do I get rid of the line at the beginning of the day. It’s a remainder of the value of the previous day. I tried manipulating the database by adjusting the time to exactly 00:00:00 instead of some (milli-)second past midnight, but without any luck.
I was thinking to solve it using the data_generator and filtering out the first few (milli-)seconds, but I don’t think I can use regular entities/sensor in the data_generator (at least, I have no clue how to obtain it’s x/y values)
If you want to have it start exactly at 00:00 then I believe you have no simple option wrt to the data.
Possibly you could write a script in apex that sets the first value to 0 but that might not be reality if it has been raining before.
What I would do: add an offset of 1 minute to the data/series
Have you tried the span setting? End or start
- type: custom:apexcharts-card
graph_span: 30d
header:
show: true
title: Daily Rainfall
show_states: false
span:
end: day
If you pull statistics you can align end, middle or start.