This is what I get:
So … dataLabels is not allowed the way you added it, same as grid_options.
dataLabels goes into a section under apex_config and grid_options is not even a apexchart attribute. Have a search in this forum for dataLabels (and remove grid_options for now)
Start simpel, donot filter out errors and add step-by-step else you start searching for needles
EDIT: noting that in using jscript, you need to add eval and sometimes convert the value from string to float, e.g.
EVAL:function(value, { seriesIndex, dataPointIndex, w }) {
return "% " + parseFloat(value).toFixed(1)
}
Thanks for all your help. But unfortunately, it still won’t show me the line n the diagram. No matter what I change or do. It does not show up.
I checked “sensor.plenticore_plus_10_battery_soc” and it is saved as a number.
type: custom:apexcharts-card
apex_config:
chart:
height: 230px
legend:
show: true
yaxis:
- id: left
min: ~0
max: ~500
decimals: 0
apex_config:
tickAmount: 4
forceNiceScale: true
title:
text: W
rotate: 0
- id: right
show: true
opposite: true
min: 0
max: 100
decimals: 0
apex_config:
tickAmount: 5
forceNiceScale: true
title:
text: "%"
rotate: 0
yaxis:
labels:
formatter: |
EVAL:function(value, { seriesIndex, dataPointIndex, w }) {
return "% " + parseFloat(value).toFixed(1)
}
all_series_config:
stroke_width: 1
float_precision: 0
show:
in_header: raw
legend_value: false
opacity: 0.2
statistics:
type: mean
period: 5minute
span:
end: minute
graph_span: 24h
header:
show: true
title: ""
show_states: true
colorize_states: true
floating: false
series:
- entity: sensor.plenticore_plus_10_sum_power_of_all_pv_dc_inputs
name: Solarproduktion
color: orange
yaxis_id: left
type: area
- entity: sensor.plenticore_plus_10_home_power
name: Hausverbrauch
color: purple
yaxis_id: left
type: area
- entity: sensor.plenticore_plus_10_battery_soc
name: SoC
color: teal
yaxis_id: right
type: line
experimental:
disable_config_validation: false
card_mod:
style: |
div#header__title {
font-size: 18px;
margin-top:0.25rem;
margin-bottom:0.5rem
}
div#header__states {
justify-content: start;
}
div#state__value #state{
font-size: 18px;
padding-right:5px
}
Strange, it does indeed work for you.
I’m now creating my chart from scratch. Let see if I can sort out the issue.
probably it’s because of your SOC-sensor
I just found out its because of this:
statistics:
type: mean
period: 5minute
when I remove it, the line does show up.
my SoC sensor does not like those lines, so I added them just for my other two sensors.
Now it’s looking the way I want.
Not all sensors create statistiscs of all types … you can doublecheck this with the statistics graph
And you are not using dataLabels, have you given up on that?
For those that have been struggling with imported statistics, using the HA-enforced : in the name, with some posts earlier (my thanks to the OPs) above this could be working with the datagenerator.
For me, I have a gas-consumption being imported, data from the provider but always 2-3 delay
On the marked items:
- the entity can be any entity, it is a dummy entry and is ignored for the results
- my imported data is in entity: gazpar:gazpar_ etc.
- you have to provide the statistic entity id twice
- I am using the state value of the statistic, this can be something else too if you need it (check via statistics graph if it exists or directly in the db)
data_generator: |
const stat_entity =
'gazpar:gazpar_thuis_consumption_stat';
var statistics = await hass.callWS({
type: 'recorder/statistics_during_period',
start_time: new Date(start).toISOString(),
end_time: new Date(end).toISOString(),
statistic_ids: [stat_entity],
period: "hour",
});
var stats = statistics[stat_entity];
var result = [];
var len = stats.length;
for (let i = 0; i < len; i++) {
let stat = stats[i].state;
result.push([(new Date(stats[i].end).getTime())
,stat]);
}
return result;
Hello all,
I’m having some issues with a sensor on a plot and hoping someone can help me. Basically, I have a sensor to track the target temperature of my water heater (“Target” in plot below). The sensor works fine in home assistant when I look at it, but when I plot it in apex-charts, portions of it’s history do not appear following a restart or reload of YAML. The hot water target temperature is a template sensor and other sensors on the plot are also template sensors. I have no idea why this one does not plot. My only hypothesis is that it’s a sensor whose value is not changing like the others?
Here is the code for the template sensor:
- name: "Hot Water Target Temperature"
unit_of_measurement: "°F"
device_class: "temperature"
state_class: "measurement"
state: "{{state_attr('climate.econet_hpwh_water_heater','temperature')}}"
Below is the code for the chart
type: custom:apexcharts-card
header:
show: true
title: Hot Water Temperature & Activity
show_states: false
colorize_states: true
span:
end: minute
graph_span: 24h
yaxis:
- id: left
max: ~120
min: ~100
decimals: 0
- id: right
max: 1
min: 0
opposite: true
show: false
apex_config:
yaxis:
labels: false
all_series_config:
show:
legend_value: false
series:
- entity: sensor.hot_water_current_temperature
type: line
color: var(--primary-color)
stroke_width: 2
name: Current Temperature
yaxis_id: left
- entity: sensor.econet_hpwh_lower_tank_temperature
type: line
color: var(--accent-color4)
stroke_width: 2
name: Lower Temperature
yaxis_id: left
- entity: sensor.hot_water_target_temperature
type: line
curve: stepline
stroke_width: 2
color: var(--accent-color2)
name: Target
yaxis_id: left
- entity: binary_sensor.econet_hpwh_compressor
transform: "return x === 'on' ? 1 : 0;"
type: area
curve: stepline
stroke_width: 0
color: var(--accent-color)
name: Water Heater Running
opacity: 0.3
yaxis_id: right
- entity: switch.recirculating_pump_smart_plug
transform: "return x === 'on' ? 1 : 0;"
type: area
curve: stepline
stroke_width: 0
color: var(--accent-color3)
name: Recirc Pump Running
opacity: 0.8
yaxis_id: right
what do you mean…it shows a line, not? And of course it cannot show values when they are not there. Add: fill_raw: last
Sure. There are values captured in the sensor. Nevertheless, the fill_raw: last worked great, so thank you.
great then please mark my post with the solutoin as ‘solution’ so others can benefit as well.
This seems like a very simple thing, but I can’t for the life of me find an answer…
Is there a way to create an area graph with the origin / fill area centered on something other than zero? I’m trying to make a weekly temperature area graph where the line/area is one color when the temperature is above freezing and a different color when the temperature is below freezing.
The graph itself and the color thresholds weren’t too hard to figure out, but the fill area on the graph always center and fill to the zero line. I’m a backwater American though and freezing in Farenheit is 32 - I’d like the fill area to “center” on 32 rather than 0.
Show code and card ?
Code:
type: custom:apexcharts-card
graph_span: 7d1s
span:
end: day
header:
show: true
title: Weekly Temperature
show_states: true
colorize_states: true
series:
- entity: sensor.ecowitt_wh90_outdoor_temperature
color_threshold:
- value: 32
color: blue
- value: 33
color: darkorange
stroke_width: 2
fill_raw: last
curve: smooth
type: area
experimental:
color_threshold: true
Graph currently looks like this:
What I’m trying to achieve:
This will not work as it fills below the line and you want a combination of above and below. Only option (that I know of) is via ‘line’
EDIT: yes…it does work indeed but only for the below 0 ones…now I get your point…will have a look
It is a bit fiddly as I had to fake a below-zero graph
I am tweaking both the series values as well as the yaxis ones… maybe you can bake cake with this
i.e. bring the graph below 0 first, then apply the threshold. then fake the yaxis back to Fahrenheit
Clever idea. It seems to have worked visually in that the lines sit in the correct place on the graph, and fill above and below the way I wanted.
The problem now is that if you mouse over the graph to see the temperature value at a specific time, the rollover text will show the modified values (like -3 F), so that’s a bit confusing.
Also that can be tweaked but you have to search in this loooong post. It will however become one tweak after the other and it becomes less and less to manage. For one card OK but …well
EDIt, this issue has nothing to do with F vs C but with values above/below 0