FTUI3 Proplanta Wetter

Aus FHEMWiki
Version vom 1. Februar 2023, 20:41 Uhr von Andreas r (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „== Zielsetzung == Aufbau einer Wetterseite mit der Wetterkarte der Unwetterzentrale (D) inkl der Unwetterwarnungen und einer 7-Tage-Vorhersage mit den Daten v…“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Zielsetzung

Aufbau einer Wetterseite mit der Wetterkarte der Unwetterzentrale (D) inkl der Unwetterwarnungen und einer 7-Tage-Vorhersage mit den Daten von Proplanta.

Voraussetzungen

- Fhem mit installiertem FTUI3 (https://wiki.fhem.de/wiki/FHEM_Tablet_UI_v3) - Fhem-Device für die Unwetterzentrale (https://fhem.de/commandref_DE.html#UWZ) - Fhem-Device für Proplanta (https://fhem.de/commandref_DE.html#PROPLANTA)

Umsetzung

Definition der Hauptseite mit Aufrufen von Content-Dateien für die Warnmeldung und die Wettervorhersagen: 

<ftui-grid base-width="78" base-height="70" margin="3">
<ftui-grid-tile row="1" col="1" height="10" width="9">
<header>Unwetterzentrale</header>
<ftui-image heigth="120%" width="120%" left="-55px" src="https://www.unwetterzentrale.de/images/map/bayern_index.png"
</ftui-image>

</ftui-grid-tile>
<ftui-grid-tile row="1" col="10" height="5" width="8">
<header>Unwetterwarnungen</header>
<ftui-swiper id="Warnung_SW" dots style="font-size:1.5em" @click="Warnung_SW.next()" [hidden]="Unwetterzentrale:WarnCount | map('0:true, .*:false')">
<ftui-content id="Warn_0" file="./content/Wetter_Warnhinweise.html" Warn_NR="Warn_0">

</ftui-content>
<ftui-content [hidden]="Unwetterzentrale:WarnCount | map('2|3|4|5:false, .*:true')" id="Warn_1" file="./content/Wetter_Warnhinweise.html" Warn_NR="Warn_1">
</ftui-content>

<ftui-content [hidden]="Unwetterzentrale:WarnCount | map('3|4|5:false, .*:true')" id="Warn_2" file="./content/Wetter_Warnhinweise.html" Warn_NR="Warn_2">
</ftui-content>

<ftui-content [hidden]="Unwetterzentrale:WarnCount | map('4|5:false, .*:true')" id="Warn_3" file="./content/Wetter_Warnhinweise.html" Warn_NR="Warn_3">
</ftui-content>

<ftui-content [hidden]="Unwetterzentrale:WarnCount | map('5:false, .*:true')" id="Warn_4" file="./content/Wetter_Warnhinweise.html" Warn_NR="Warn_4">
</ftui-content>

</ftui-swiper>
<ftui-label color="green" size="4" [hidden]="Unwetterzentrale:WarnCount | map('0:false, .*:true')" text="Aktuell keine Warnmeldungen">
</ftui-label>

</ftui-grid-tile><ftui-grid-tile row="6" col="10" height="5" width="8">

<header>7-Tage Vorhersage</header>
<ftui-swiper id="Vorhersage_SW" dots style="font-size:1.5em" @click="Vorhersage_SW.next()">

<ftui-content id="VHS_0" file="./content/Wetter_Vorhersage.html" VHS_NR="fc0">
</ftui-content>

<ftui-content id="VHS_1" file="./content/Wetter_Vorhersage.html" VHS_NR="fc1">
</ftui-content>

<ftui-content id="VHS_2" file="./content/Wetter_Vorhersage.html" VHS_NR="fc2">
</ftui-content>

<ftui-content id="VHS_3" file="./content/Wetter_Vorhersage.html" VHS_NR="fc3">
</ftui-content>

<ftui-content id="VHS_4" file="./content/Wetter_Vorhersage.html" VHS_NR="fc4">
</ftui-content>

<ftui-content id="VHS_5" file="./content/Wetter_Vorhersage.html" VHS_NR="fc5">
</ftui-content>

<ftui-content id="VHS_6" file="./content/Wetter_Vorhersage.html" VHS_NR="fc6">
</ftui-content>

</ftui-swiper>
</ftui-grid-tile>

</ftui-grid>

Content-Datei für die Wetterwarnungen:

<ftui-row [color]="Unwetterzentrale:WarnUWZLevel_Color | map('gelb:yellow, orange:orange, rot:red,

violett:violet')">

<ftui-column width="15%">

<ftui-image [src]="Unwetterzentrale:Vorlage:Warn NR_IconURL" nocache margin="1" left="10px">

</ftui-image>

</ftui-column>

<ftui-column height="82%" margin="1">

<ftui-label padding="1" scroll text-align="left" size="3"

[text]="Unwetterzentrale:Vorlage:Warn NR_LongText">

</ftui-label>

</ftui-column>

</ftui-row> <ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

text="Gültig vom ">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

[text]="Unwetterzentrale:Vorlage:Warn NR_Start_Date">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

[text]="Unwetterzentrale:Vorlage:Warn NR_Start_Time">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

text="Uhr">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

text="bis zum">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

[text]="Unwetterzentrale:Vorlage:Warn NR_End_Date">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

[text]="Unwetterzentrale:Vorlage:Warn NR_End_Time">

</ftui-label>

<ftui-label size="2" color="primary" top="-30px" style="position:relative;" class="bold"

text="Uhr">

</ftui-label> Content-Datei für die Wettervorhersage (7-Tage):

<ftui-label

[text]="WetterProplanta:Vorlage:VHS NR_date | toDate() | t=>(t.toLocaleDateString()===(new

Date()).toLocaleDateString())?'Heute':ftuiHelper.dateFormat(t,'eeee - DD.MM.YYYY')" color="white" class="bold"

margin="-1">

</ftui-label>

<ftui-row height="50%">

<ftui-column>

<ftui-label

text="morgens" size="2">

</ftui-label>

<ftui-weather icon-set="kleinklimaFHEM" provider="proplantaICON_LONG"

[condition]="WetterProplanta:Vorlage:VHS NR_weatherMorningIcon">

</ftui-weather>

<ftui-label [color]="WetterProplanta:Vorlage:VHS NR_temp06 | step('-73:violet, -9:blue, 10:green, 25:orange,

32:red')" margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_temp06" unit="°C">

</ftui-label>

<ftui-label margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_weatherMorning">

</ftui-label>

<ftui-row>

<ftui-label text-align="left" left="55px" style="position:relative;"

text="Max:">

</ftui-label>

<ftui-label text-align="right" left="-55px" style="position:relative;"

[text]="WetterProplanta:Vorlage:VHS NR_tempMax" unit="°C">

</ftui-label>

</ftui-row>

<ftui-row>

<ftui-label text-align="left" left="55px" style="position:relative;"

text="Min:">

</ftui-label>

<ftui-label text-align="right" left="-55px" style="position:relative;"

[text]="WetterProplanta:Vorlage:VHS NR_tempMin" unit="°C">

</ftui-label>

</ftui-row>

</ftui-column>

<ftui-column>

<ftui-label

text="Mittags" size="2">

</ftui-label>

<ftui-weather icon-set="kleinklimaFHEM" provider="proplantaICON_LONG"

[condition]="WetterProplanta:Vorlage:VHS NR_weatherDayIcon">

</ftui-weather>

<ftui-label [color]="WetterProplanta:Vorlage:VHS NR_temp12 | step('-73:violet, -9:blue, 10:green, 25:orange,

32:red')" margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_temp12" unit="°C">

</ftui-label>

<ftui-label margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_weatherDay">

</ftui-label>

<ftui-row>

<ftui-label text-align="left" left="45px" style="position:relative;"

text="Regen:">

</ftui-label>

<ftui-label text-align="right" left="-40px" style="position:relative;"

[text]="WetterProplanta:Vorlage:VHS NR_chOfRainDay" unit="%">

</ftui-label>

</ftui-row>

<ftui-row>

<ftui-label text-align="left" left="45px" style="position:relative;"

text="Sonne:">

</ftui-label>

<ftui-label text-align="right" left="-40px" style="position:relative;"

[text]="WetterProplanta:Vorlage:VHS NR_sun" unit="%">

</ftui-label>

</ftui-row>

</ftui-column>

<ftui-column>

<ftui-label

text="Abends" size="2">

</ftui-label>

<ftui-weather icon-set="kleinklimaFHEM" provider="proplantaICON_LONG"

[condition]="WetterProplanta:Vorlage:VHS NR_weatherEveningIcon">

</ftui-weather>

<ftui-label [color]="WetterProplanta:Vorlage:VHS NR_temp18 | step('-73:violet, -9:blue, 10:green, 25:orange,

32:red')" margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_temp18" unit="°C">

</ftui-label>

<ftui-label margin="0.5"

[text]="WetterProplanta:Vorlage:VHS NR_weatherEvening">

</ftui-label>

<ftui-row>

<ftui-label left="20px" style="position:relative;"

text="UV:">

</ftui-label>

<ftui-label [color]="WetterProplanta:Vorlage:VHS NR_uv | step('0:green, 3:yellow, 6:orange, 8:red, 11:violet')"

left="-20px" style="position:relative;"

[text]="WetterProplanta:Vorlage:VHS NR_uv">

</ftui-label>

</ftui-row>

<ftui-label

[text]="">

</ftui-label>

</ftui-column>

</ftui-row>

Ergebnis:

Abgerufen von „http://wiki.fhem.de/w/index.php?title=FTUI3_Proplanta_Wetter&oldid=38019“