Hi,
also ich hab es so gelöst, das ich mir einen REST Sensor angelegt habe und diesen in einer APEX Chart Darstelle, das sieht dann so aus (ab 13 Uhr ist dann der Preis von Morgen da, wie in der App auch):
Hier der Sensor, der bei mir in der sensors.yaml sitzt (bei Authorization deinen API Key Eintragen):
- platform: rest
name: Tibber Prices
resource: https://api.tibber.com/v1-beta/gql
method: POST
payload: '{ "query": "{ viewer { homes { currentSubscription { status priceInfo { current { total } today { total } tomorrow { total } } } } } }" }'
json_attributes_path: "$.data.viewer.homes[0].currentSubscription.priceInfo"
json_attributes:
- today
- tomorrow
value_template: "{{ value_json.data.viewer.homes[0].currentSubscription.priceInfo.current.total | float }}"
scan_interval: 30
headers:
Authorization: HIER DEIN API SCHLÜSSEL EINTRAGEN
Content-Type: application/json
User-Agent: REST
unit_of_measurement: EUR/kWh
Und hier die Config für die APEX Chart:
type: custom:apexcharts-card
experimental:
color_threshold: true
all_series_config:
unit: Cent/kWh
apex_config:
grid:
show: true
borderColor: '#E0E0E0'
chart:
height: 250px
tooltip:
enabled: true
followCursor: false
x:
show: false
fixed:
enabled: true
header:
show: true
title: Strompreis
show_states: true
colorize_states: true
standard_format: false
graph_span: 48h
now:
show: true
color: 9E9E9E
span:
start: day
series:
- entity: sensor.tibber_prices
name: Preis
show:
in_header: before_now
name_in_header: false
color_threshold:
- value: 0
color: 4DD0E1
- value: 10
color: 26A69A
- value: 15
color: 4CAF50
- value: 20
color: 7CB342
- value: 25
color: FBC02D
- value: 30
color: EF6C00
- value: 40
color: B71C1C
type: line
curve: stepline
extend_to: false
stroke_width: 2
float_precision: 2
data_generator: |
const noon = new Date()
noon.setHours(0, 0, 0, 0)
const prices = entity.attributes.today.concat(entity.attributes.tomorrow);
const data = [];
for(let i = 0; i < prices.length; i++) {
data.push([noon.getTime() + i * 1000 * 3600, prices[i].total * 100])
}
return data;