Just to put it here, if someone is having same kind of problems:
- if combining multiple y series with into on timeline, do not use transform. Try to use only original data values. I could use value transformation in data_generator -block
Working chart
New code
type: custom:config-template-card
variables:
LOWPOINT: states['sensor.nordpool_apexchart_y_min']
MOVINGAVERAGE: states['sensor.nordpool_price_today_average_whole_day_longterm_mean']
entities:
- ${MOVINGAVERAGE.entity_id}
card:
type: custom:apexcharts-card
graph_span: 13d
span:
start: day
offset: '-7d'
apex_config:
xaxis:
labels:
datetimeFormatter:
day: dd ddd
chart:
height: 300%
yaxis:
- id: tanaan
decimals: 3
apex_config:
tickAmount: 4
- id: power
opposite: true
decimals: 0
min: 0
- id: temperature
opposite: true
decimals: 0
show:
last_updated: true
experimental:
brush: true
color_threshold: true
brush:
selection_span: 13d
apex_config:
xaxis:
labels:
datetimeFormatter:
day: dd ddd
header:
title: Sähkön hinta, tuulivoima ja lämpötila
show: true
show_states: true
colorize_states: true
now:
show: true
label: Nyt
series:
- entity: sensor.fingrid_wind_power_generation_forecast_hourly
yaxis_id: power
name: Windpower gen forecast
type: line
curve: stepline
stroke_width: 2
color: grey
data_generator: |
return entity.attributes.events.event.map((d, index) => {
return [new Date(d["start_time"]).getTime(), entity.attributes.events.event[index]["value"]*1];
});
show:
header_color_threshold: true
legend_value: false
in_header: false
name_in_header: false
extremas: true
- entity: weather.openweathermap
yaxis_id: temperature
name: Lämpötilaennuste
curve: stepline
stroke_width: 2
color: purple
data_generator: |
return entity.attributes.forecast.map((entry) => {
return [new Date(entry.datetime).getTime(), entry.temperature];
});
show:
header_color_threshold: true
legend_value: false
in_header: false
name_in_header: false
extremas: true
- entity: sensor.weather_combined_temperature
yaxis_id: temperature
name: Lämpötila
curve: stepline
stroke_width: 2
extend_to: now
color: purple
show:
header_color_threshold: true
legend_value: false
in_header: false
name_in_header: false
extremas: true
- entity: sensor.nordpool_fi
name: Tänään
yaxis_id: tanaan
show:
in_brush: true
in_chart: true
extremas: true
in_header: raw
header_color_threshold: true
legend_value: false
type: column
data_generator: |
return entity.attributes.raw_today.map((start, index) => {
return [new Date(start["start"]).getTime(), entity.attributes.raw_today[index]["value"]*0.01];
});
color_threshold:
- value: ${MOVINGAVERAGE.state * 0.1}
color: lightblue
- value: ${MOVINGAVERAGE.state * 0.33}
color: darkgreen
- value: ${MOVINGAVERAGE.state * 0.75}
color: goldenrod
- value: ${MOVINGAVERAGE.state * 1.25}
color: darkred
- entity: sensor.nordpool_fi
name: Huomenna
yaxis_id: tanaan
show:
in_brush: true
in_chart: true
extremas: false
in_header: false
header_color_threshold: true
legend_value: false
type: column
data_generator: |
return entity.attributes.raw_tomorrow.map((start, index) => {
return [new Date(start["start"]).getTime(), entity.attributes.raw_tomorrow[index]["value"]*0.01];
});
color_threshold:
- value: ${MOVINGAVERAGE.state * 0.1}
color: lightblue
- value: ${MOVINGAVERAGE.state * 0.33}
color: darkgreen
- value: ${MOVINGAVERAGE.state * 0.75}
color: goldenrod
- value: ${MOVINGAVERAGE.state * 1.25}
color: darkred
- entity: sensor.nordpool_price_now_euro
name: Price_euro
yaxis_id: tanaan
show:
in_brush: true
in_chart: true
extremas: true
in_header: false
header_color_threshold: true
legend_value: false
type: column
color_threshold:
- value: ${MOVINGAVERAGE.state * 0.1}
color: lightblue
- value: ${MOVINGAVERAGE.state * 0.33}
color: darkgreen
- value: ${MOVINGAVERAGE.state * 0.75}
color: goldenrod
- value: ${MOVINGAVERAGE.state * 1.25}
color: darkred
- entity: sensor.nordpool_price_now_euro
name: Price_euro
yaxis_id: tanaan
offset: '-7d'
show:
in_brush: true
in_chart: true
extremas: true
in_header: false
header_color_threshold: true
legend_value: false
type: column
color_threshold:
- value: ${MOVINGAVERAGE.state * 0.1}
color: lightblue
- value: ${MOVINGAVERAGE.state * 0.33}
color: darkgreen
- value: ${MOVINGAVERAGE.state * 0.75}
color: goldenrod
- value: ${MOVINGAVERAGE.state * 1.25}
color: darkred
