This has to be my new favourite card - knocked this up in about 15 minutes this evening:
Combines the Amber Electric historic electricity price with the predicted price
Code for those interested
- type: custom:apexcharts-card
graph_span: 59h
header:
show: true
title: "Amber Price Prediction (General Usage - E1)"
span:
start: hour
offset: -1d
apex_config:
chart: { type: "area", height: 300 }
stroke: { show: true, width: 3, curve: smooth }
legend: { show: false }
dataLabels: { enabled: false }
xaxis:
{
type: "datetime",
labels: { datetimeFormatter: { month: "ddd", day: "ddd" } },
}
fill:
{
type: "gradient",
gradient:
{
shadeIntensity: 1,
inverseColors: false,
opacityFrom: 0.45,
opacityTo: 0.05,
stops: [20, 100, 100, 100],
},
}
series:
- entity: sensor.amber_general_usage_price
name: Predicted Price
type: area
# color: "#008FFB"
extend_to_end: false
data_generator: |
return entity.attributes.price_forcecast.map((entry) => {
return [new Date(entry.pricing_period), entry.price];
});
- entity: sensor.amber_general_usage_price
name: Historic Price
type: area
extend_to_end: false
- type: custom:apexcharts-card
graph_span: 59h
header:
show: true
title: "Amber Price Prediction (Solar Feed-In)"
span:
start: hour
offset: -1d
apex_config:
chart: { type: "area", height: 300 }
stroke: { show: true, width: 3, curve: smooth }
legend: { show: false }
dataLabels: { enabled: false }
xaxis:
{
type: "datetime",
labels: { datetimeFormatter: { month: "ddd", day: "ddd" } },
}
fill:
{
type: "gradient",
gradient:
{
shadeIntensity: 1,
inverseColors: true,
opacityFrom: 0.45,
opacityTo: 0.05,
stops: [20, 100, 100, 100],
},
}
series:
- entity: sensor.amber_solar_feed_in_tariff
name: Predicted Price
type: area
# color: "#008FFB"
extend_to_end: false
data_generator: |
return entity.attributes.price_forcecast.map((entry) => {
return [new Date(entry.pricing_period), entry.price];
});
- entity: sensor.amber_solar_feed_in_tariff
name: Historic Price
type: area
extend_to_end: false