Für unser smartes Zuhause habe ich ein alternatives Wetter-Widget gesucht, welches ich noch besser und flexibler an meinen Anwendungsfall anpassen kann. Dabei bin ich auf das Widget von www.daswetter.com gestoßen. Das Wetter-Widget ist zwar eigentlich für die Nutzung in Webseiten gedacht, lässt sich natürlich aber auch in VIS integrieren. In diesem Artikel möchte ich daher die Konfiguration sowie Integration in die eigene VIS Oberfläche zeigen.
Im ersten Schritt gehen wir auf die Wetter-Widget Seite
Über die Schritte 1-5 kann das Wetter-Widget entsprechend nach den eigenen Wünschen und Bedürfnissen konfiguriert werden. Im ersten Schritt wird der eigene Ort über die Auswahl des Landes und Bundesland ausgewählt. Falls der Ort nicht in der Liste eingetragen ist, einfach den am nächsten gelegenen Ort wählen. Optional kann dann noch die Überschrift angepasst werden.
Im zweiten Schritt wird das Format ausgewählt mit dem das Wetter-Widget angezeigt werden soll. Dabei können die Anzahl der dargestellten Tage für die Vorhersage sowie die Ausrichtung ausgewählt werden.
Im dritten Schritt kann die Auswahl des Inhaltes sowie die Skala der Temperatur (Grad Celsius oder Fahrenheit) ausgewählt werden.
Nach dem die Größe sowie die Inhalte des Widget definiert wurden, können abschließend noch Einstellungen zum Aussehen der Icons sowie Farb-Einstellungen getroffen werden. Hier kann das Widget wirklich perfekt an das eigene Design der VIS Oberfläche angepasst werden.
Das fertige Widget sieht nun mit meinem Einstellungen folgendermaßen aus:
Im nächsten Schritt muss nun hier die E-Mail Adresse eingegeben werden. Laut dem Anbieter des Widget wird diese nur erfasst, um bei Änderungen des Widgets (zusätzliche Einstellungen oder neuer Aufruf-Code) darüber zu informieren.
Nach der Eingabe des E-Mail und Bestätigung der Schaltfläche „Code generieren“ wird nun ein Script-Code generiert, welchen wir per Copy&Paste in VIS weiterverwenden werden.
Im nächsten Schritt wechseln wir nun in die ioBroker VIS Konfigurationsoberfläche und wählen die View aus, in dem wir das Wetter anzeigen möchten.
Auf der linken Seite im Bereich „Widget einfügen“ wählen wir nun das statische HTML Widget und fügen dies in die View ein.
Im nächsten Schritt fügen wir den Code von der Webseite in den Bereich Allgemein – HTML ein. Nach dem Einfügen des Codes wird nun das Widget geladen und in in dem HTML-Widget angezeigt.
Über diese Vorgehensweise können natürlich auch andere HTML-Inhalte in Views geladen werden.