ioBroker-Visualisierung – VIS-Adapter

VIS-Adapter

Der VIS-Adapter ist eine der gängigsten Displaylösungen in ioBroker. Die Benutzeroberfläche kann mit zusätzlichen Widgets flexibel angepasst werden.

Mit Hilfe des VIS Editors können wir kreative Smart Home Visualisierungen erstellen, die unseren Bedürfnissen entsprechen. VIS stellt den Editor und die Benutzeroberfläche über einen Webserver zur Verfügung, der in einem Browser dargestellt werden kann.

werbung – amazon.de

Der VIS-Adapter ist einfach zu installieren. Wählen Wir auf der Seite iobroker-Adapter den VIS-Adapter aus und klick zum Installieren auf die Schaltfläche „+“.

Geben Wir nach der Installation des VIS-Adapters den Lizenzschlüssel auf der Konfigurationsseite ein. Wir können dies auf iobroker.net anfordern, es ist für den persönlichen Gebrauch kostenlos.

VIS-Adapter Lizenzschlüssel
VIS-Adapter Lizenzschlüssel

Anschließend können Wir mit dem VIS-Adapter eigene Visualisierungen erstellen. Den VIS-Editor finden Wir unter: 192.168.x.xxx:8082/vis/edit.html

VIS-Bearbeitungsoberfläche
VIS-Bearbeitungsoberfläche

Auf der Seite Adapter können Sie zusätzliche Widgets für den VIS-Adapter installieren, mit welchem Wir können die Anzeige abwechslungsreicher gestalten.

Wir können aus den Widgets aus der Liste auf der linken Seite auswählen. Platzieren wir es einfach per „Drag and Drop“ an der gewünschten Stelle. Stellen Wir dann rechts die Widget-Eigenschaften ein. Das Wichtigste ist, die Objekt-ID für das Widget auszuwählen. So können Wir Widgets mit ioBroker-Datenpunkten verbinden.

VIS-Objekt-ID hinzufügen
VIS-Objekt-ID hinzufügen

Im folgenden Beispiel habe ich für das Bulb-Widget einen Datenpunkt namens Wohnzimmerlicht ausgewählt. Wenn ich also die URL „http://192.168.x.xxx:8082/vis/index.html#Test-Wiew“ öffne und auf das Glühlampensymbol klicke, geht das Licht im Wohnzimmer an.

VIS Bulb-Widget
VIS – Glühbirnen-Widget

Wenn „Read only“ aktiviert ist, dient das Symbol nur als Indikator. Fügen Wir einen Schalter hinzu und geben Wir den gleichen Datenpunkt für diesen Schalter ein, so Wir die Lampe mit dem Schalter schalten können und das Glühbirnensymbol nur den Status der Lampe anzeigt.

Fügen Sie im VIS-Editor einen Schalter zur Glühlampe hinzu
Fügen Sie im VIS-Editor einen Schalter zur Glühlampe hinzu

Sehen wir uns das Ergebnis an:

Es funktioniert gut.

Glühlampensymbol mit Schalter in der VIS-Benutzeroberfläche
Glühlampensymbol mit Schalter in der VIS-Benutzeroberfläche

Widget-Gruppierung im VIS-Konstruktor
Widget-Gruppierung im VIS-Konstruktor

Widgets können einfach gruppiert werden, indem Sie sie auswählen, dann mit der linken Maustaste klicken und im Menü Gruppieren auswählen.

Somit wird beim Verschieben oder Kopieren ihre relative Position beibehalten.


Im folgenden Beispiel verwenden wir das MeterGauge-Modul, um Das Wohnzimmer temperatur anzuzeigen. Wählen wir auch hier zunächst die Objekt-ID und dann die Feinabstimmung.

Temperaturanzeige mit MeterGauge Widget auf dem ioBroker VIS Adapter
Temperaturanzeige mit MeterGauge Widget auf dem ioBroker VIS Adapter

Wenn der iCal-Adapter installiert ist, auf diese Weise können wir die Termine unserer bevorstehenden Veranstaltungen einfach anzeigen. Wählen wir das Widget „String (unescaped)“ aus und setzen wir den Datenpunkt.

VIS - iCal-Ereignisanzeige
VIS – iCal-Ereignisanzeige

Wie aus den obigen Beispielen ersichtlich ist, ist der VIS-Adapter einfach zu bedienen und leicht zu erlernen. Die Möglichkeiten sind fast endlos, mit etwas Übung können wir eine sehr schöne Oberfläche erstellen, um unser Smart Home zu überwachen.

Viel Glück und viel Spass!

amazon
Echo Dot 5. Generation Smarter Bluetooth Lautsprecher mit Alexa
amazon
Echo Studio Der beste Klang, den Echo-Lautsprecher je geboten haben – mit Dolby Atmos und Alexa

werbung