Ich wollte meine Tageslicht Ansicht auf meinem Dashboard wetterbedingt und Tageszeitabhängig angezeigt bekommen. Um das zu erreichen habe ich mir zwei Sensoren zur Berechnung und ein Overlay Bild zur Darstellung erstellt. In diesem Beitrag möchte ich Euch Schritt für Schritt zeigen was man dazu alles benötigt und wie ich das erstellt habe.
Tageslicht Ansicht erstellen
Beginnen wir damit, das Tageslicht Bild in Sweet Home 3D zu erstellen.
Wir öffnen unseren Flurplan in Sweet Home 3D, deaktivieren alle Beleuchtungen und klicken auf das Fotosymbol .
Nun müssen wir dieselben Einstellungen verwenden, die wir auch bei unserem Floorplan benutzt haben, abgesehen von der Helligkeit. Hier wähle ich eine Uhrzeit aus, welche in etwa um die Mittagszeit, in meinem Fall 13:00 Uhr angezeigt wird.
Wenn diese Einstellungen abgeschlossen sind, gehe ich auf Foto erstellen.

Nun habe ich ein fertig gerendertes Bild in einer kompletten Übersicht.

Leider ist es in Sweet Home 3D nicht möglich den Schatten einer Decke, sprich nur den Tageslichteinfall durch die Fenster anzuzeigen. Aus diesem Grund öffne ich das nun gerenderte Bild in einem Bildbearbeitungsprogramm wie Gimp oder Photoshop und entferne alle Bereiche, die in der Wohnung sind, abgesehen von den Fensterflächen.
Damit dieses Bild dann als Overlay, also ein überlagerndes Bild fungiert, muss der Hintergrund dieses Bildes entfernt und transparent dargestellt werden.

Somit sichern wir dieses Bild als PNG und übertragen es auf unseren Speicherort in Home Assistant.
Tageslicht Sensoren anlegen
Als nächstes habe ich den Sensor für die Tageslichtsteuerung angelegt.
Als Grundvoraussetzung benötigst du folgende Sensoren bzw. Integrationen.
- Die standard Integration sun.sun mit ihrem sensor.sun_solar_elevation Sensor
- ein Sensor der die Bewölkung anzeigt, wie zB. von OpenWeatherMap der sensor.openweathermap_cloud_coverage
- und zum dritten den höchsten Sonnenstand im Jahr als Winkel.
Diesen Winkel kann man sich googeln oder im Genauen auf der Webseite
https://www.timeanddate.de/sonne/ anzeigen lassen.
Sehen wir uns an, wie groß der Winkel in meiner Region zur Zeit und zur Sommersonnenwende, dem höchsten Sonnenstand des Jahres, am 21.Juni ist.
Dazu öffne ich die Webseite, gebe bei der Stadtsuche meinen Ort ein, also Linz und gehe auf Suchen.


Nun werden wir schon die Daten für den derzeitigen Zeitpunkt angezeigt.

Etwas weiter unten kann ich nun bei Monat auf Juni wechseln und als Tag den 21. Auswählen.

Durch Betätigen des roten Pfeils neben dem Tagesdatum, werden mehr Informationen angezeigt und ich kann auf der Sonnenkurve mit der Maus auf den höchsten Punkt fahren. Dadurch wird mir an der rechten Seite der Vertikalwinkel, in meinem Fall, 65 Grad angezeigt.

Diesen Wert merke oder notiere ich mir.
Jetzt kommt es darauf an welchen Typ du in deiner Konfiguration für Templates verwendest.
Ich beschreib hier diese zwei Varianten:
- Template File
- Template Folder
Den Unterschied bzw. wie man diese anlegt, habe ich in diesem Beitrag bereits erklärt:
1. Template-Sensor für Template-File
Wenn du ein Template-File benutzt und dies dein erster Sensor ist, kannst du den folgenden Code im Gesamten kopieren und in dein File einfügen.
Sollten schon Sensoren angelegt sein, unbedingt beim Einfügen die Zeile
„- sensor:“
entfernen um keine Duplizierung zu haben und somit Fehler zu vermeiden.
Nun noch die Daten kontollieren bzw. tauschen.
- Tausche „sensor.sun_solar_elevation“ wenn du einen anderen Sesor für den Sonnenstand nutzt
- Tausche „sensor.openweathermap_cloud_coverage“ wenn du einen anderen Sensor für den Bewölkungsgrad benutzt
- Trage den maximalen Winkel des Sonnenstandes, hier bei „set max_elevation = 65“ ein
######################################################################################### #---------------------------------------------------------------------------------------# ##------------------------- Tageslicht Transparenz Sensor -----------------------------## #---------------------------------------------------------------------------------------# ######################################################################################### - sensor: #----------------------------------------------------------- # SONNENLICHT HELLIGKEIT BERECHNET #----------------------------------------------------------- - name: Sonnenlicht berechnet unique_id: sonnenlicht_berechent icon: mdi:sun-angle-outline state: > {%- set elevation = states('sensor.sun_solar_elevation') | float %} {%- set cloud_coverage = states('sensor.openweathermap_cloud_coverage') | float %} {%- set cloud_factor = (1 - (0.75 * ( cloud_coverage / 100) ** 3 )) %} {%- set min_elevation = -6 %} {%- set max_elevation = 65 %} {%- set adjusted_elevation = elevation - min_elevation %} {%- set adjusted_elevation = [adjusted_elevation,0] | max %} {%- set adjusted_elevation = [adjusted_elevation,max_elevation - min_elevation] | min %} {%- set adjusted_elevation = adjusted_elevation / (max_elevation - min_elevation) %} {%- set adjusted_elevation = adjusted_elevation %} {%- set adjusted_elevation = adjusted_elevation * 100 %} {%- set brightness = adjusted_elevation * cloud_factor %} {{ brightness | round }} unit_of_measurement: 'lx' device_class: 'illuminance' #----------------------------------------------------------- # TRANSPARENZ BERECHNUNG #----------------------------------------------------------- - name: Sonnenlicht Transparenz unique_id: sonnenlicht_transparenz icon: mdi:sun-clock-outline state: > {%- set sunpct = states('sensor.sonnenlicht_berechnet') | float %} {%- set opacity = sunpct / 100 | float %} {{ opacity }}
Tageslicht: Template-Sensor für Template-Folder
Benutzt du Template-Folder in deiner Konfiguration, lege ein neues File in diesem Folder an und gib ihm einen „aussagekräftigen Namen.yaml“
In meinem Fall heißt das File: „Tageslicht Transparenz.yaml“
Wenn das File angelegt ist, kannst du den folgenden Code einfach kopieren und in das File einfügen.
Nun noch die Daten kontollieren bzw. tauschen.
- Tausche „sensor.sun_solar_elevation“ wenn du einen anderen Sesor für den Sonnenstand nutzt
- Tausche „sensor.openweathermap_cloud_coverage“ wenn du einen anderen Sensor für den Bewölkungsgrad benutzt
- Trage den maximalen Winkel des Sonnenstandes, hier bei „set max_elevation = 65“ ein
######################################################################################### #---------------------------------------------------------------------------------------# ##------------------------- Tageslicht Transparenz Sensor -----------------------------## #---------------------------------------------------------------------------------------# ######################################################################################### sensor: #----------------------------------------------------------- # SONNENLICHT HELLIGKEIT BERECHNET #----------------------------------------------------------- - name: Sonnenlicht berechnet unique_id: sonnenlicht_berechent icon: mdi:sun-angle-outline state: > {%- set elevation = states('sensor.sun_solar_elevation') | float %} {%- set cloud_coverage = states('sensor.openweathermap_cloud_coverage') | float %} {%- set cloud_factor = (1 - (0.75 * ( cloud_coverage / 100) ** 3 )) %} {%- set min_elevation = -6 %} {%- set max_elevation = 65 %} {%- set adjusted_elevation = elevation - min_elevation %} {%- set adjusted_elevation = [adjusted_elevation,0] | max %} {%- set adjusted_elevation = [adjusted_elevation,max_elevation - min_elevation] | min %} {%- set adjusted_elevation = adjusted_elevation / (max_elevation - min_elevation) %} {%- set adjusted_elevation = adjusted_elevation %} {%- set adjusted_elevation = adjusted_elevation * 100 %} {%- set brightness = adjusted_elevation * cloud_factor %} {{ brightness | round }} unit_of_measurement: 'lx' device_class: 'illuminance' #----------------------------------------------------------- # TRANSPARENZ BERECHNUNG #----------------------------------------------------------- - name: Sonnenlicht Transparenz unique_id: sonnenlicht_transparenz icon: mdi:sun-clock-outline state: > {%- set sunpct = states('sensor.sonnenlicht_berechnet') | float %} {%- set opacity = sunpct / 100 | float %} {{ opacity }}
Nach dem Anlegen, Home assistant neu Starten und in den Entwicklerwerkzeugen kontrollieren ob die Sensoren angelegt sind und Daten enthalten.
Overlay in Picture Element Floorplan einfügen
Wenn bis hierher alles geklappt hat, kannst du dein Tageslicht-Overlay in deinen Floorplan einfügen.
Die Position in der Konfiguration ist am Besten direkt nach dem „Nacht-Hintergrundbild“
Um dein Bild korrekt anzuzeigen benötigst du noch folgendes:
- Kontrolliere ob die „config-template-card“ in HACS installiert ist
- den Speicherort deines 1×1 transparent Pixels
- den Speicherort deines Tageslicht-Bilds
Wenn du alles beisammen hast, kannst du dir den Code kopieren und in deine Konfiguration einfügen.
Die Pfade und Namen noch korrigieren und Speichern.
#----------------------------------------------- #----------------------------------------------- # Tageslicht Overlay #----------------------------------------------- #----------------------------------------------- - type: custom:config-template-card variables: TRANSPARENZ: states['sensor.sonnenlicht_transparenz'].state entities: - sun.sun - sensor.sonnenlicht_transparenz element: type: image entity: sun.sun image: /local/<DEIN-1x1-TRANSPARENZ-PIXEL.png> #Pfad und Name deines Bilds eingeben state_image: above_horizon: /local/<DEIN-TAGESLICHT-BILD.png> #Pfad und Name deines Bilds eingeben tap_action: action: none hold_action: action: none style: opacity: ${TRANSPARENZ} mix-blend-mode: lighten pointer-events: none top: 50% left: 50% width: 100%
Somit sollte deine Tageslichtansicht die Helligkeit nach Sonnenstand und Bewölkung anzeigen.