Here is a configuration using ApexCharts card - A highly customizable graph card to display Amber price forecasts.
type: custom:apexcharts-card
experimental:
color_threshold: true
span:
start: minute
offset: '-2h'
header:
show: true
title: Battery, Price & Cost Forecast
show_states: true
colorize_states: true
now:
show: true
label: Now
series:
- entity: sensor.amber_general_forecast
float_precision: 2
yaxis_id: first
curve: stepline
unit: $/kWh
show:
in_header: after_now
legend_value: false
stroke_width: 1
data_generator: |
return entity.attributes.forecasts.map((entry) => {
return [new Date(entry.start_time), entry.per_kwh];
});
- entity: sensor.amber_feed_in_forecast
float_precision: 2
yaxis_id: first
curve: stepline
show:
in_header: after_now
legend_value: false
stroke_width: 1
name: feed in forecast
data_generator: |
return entity.attributes.forecasts.map((entry) => {
return [new Date(entry.start_time), entry.per_kwh];
});
yaxis:
- id: first
decimals: 1
max: 1
min: 0
apex_config:
tickAmount: 2
logarithmic: false
- id: second
show: false
opposite: false
decimals: 1
max: 100
min: 0
apex_config:
tickAmount: 2
view_layout:
position: main