[Tile] TreeView: Hierarchische Baumansichten für die Kachel-Visualisierung

[Mata_Encantada]

Hallo zusammen

Ich möchte Euch mein neues Modul TreeView vorstellen, das inzwischen als Beta im Module Store verfügbar ist.

TreeView stellt hierarchische Baumstrukturen als HTML-Kachel in der Kachel-Visualisierung dar. Die Idee dahinter ist, beliebige Informationen übersichtlich zu gruppieren und bei Bedarf auf- und zuklappen zu können.

Dabei ist TreeView bewusst nicht auf einen bestimmten Anwendungsfall beschränkt. Ob Raumnavigation, Anlagenüberwachung oder ein einfaches Menüsystem – die Baumstruktur lässt sich frei gestalten.

Drei Beispiele aus der Praxis

1. Appartement – Raumstruktur mit Live-Werten

Im ersten Beispiel verwende ich TreeView zur Darstellung einer Raumhierarchie. Die Knoten können mit Symcon-Icons versehen werden und gleichzeitig aktuelle Variablenwerte anzeigen.

So lassen sich beispielsweise Beleuchtung, Klima, Türen und Fenster übersichtlich nach Räumen gruppieren. Über die Verknüpfung mit Symcon-Objekten können die Knoten auch zur Navigation innerhalb der Visualisierung verwendet werden.

Durch die beliebige Verschachtelung und das gezielte Auf- und Zuklappen einzelner Bereiche lassen sich auch sehr grosse Wohnanlagen mit zahlreichen Gebäuden, Etagen und Räumen übersichtlich strukturieren und verwalten.

2. Viessmann-Wärmepumpe – Technische Anlagenübersicht

Das zweite Beispiel zeigt die Daten meiner Vitocal 300-G, die über Modbus in Symcon eingebunden ist.

Die zahlreichen Messwerte und Betriebszustände sind nach Funktionsbereichen gruppiert. Neben aktuellen Temperaturen und Pumpenzuständen werden auch Betriebsstunden und Jahresarbeitszahlen angezeigt.

Hier verwende ich die klassische Baumdarstellung mit Verbindungslinien.

3. Gästehandbuch – Einfaches Menüsystem

TreeView kann auch ganz ohne Variablen, Icons oder Zielobjekte eingesetzt werden.

Im dritten Beispiel dient es als Menüstruktur für ein Gästehandbuch. Die Kapitel lassen sich aufklappen, um die jeweiligen Unterthemen anzuzeigen.

Hier kommt die Plus/Minus-Darstellung ohne Verbindungslinien zum Einsatz.

Funktionen

TreeView bietet unter anderem:

• Drei Darstellungsarten: Pfeile, Plus/Minus und Plus/Minus mit Verbindungslinien
• Frei definierbare Hierarchien mit beliebiger Verschachtelung
• Drag-and-Drop-Konfiguration der Baumstruktur
• Anzeige von Variablenwerten einschliesslich ihrer Profile
• Individuelle Hintergrundfarben für Knoten
• Navigation zu Symcon-Objekten über Ziel-IDs
• Clientbezogenen Zustand der aufgeklappten Knoten
• Eine umfangreiche PHP-API zum Erstellen, Ändern und Verwalten der Baumstruktur

Die Baumstruktur kann sowohl über das Konfigurationsformular als auch vollständig über PHP aufgebaut und verändert werden. Für die drei gezeigten Beispiele war keine eigene HTML-Programmierung notwendig.

Beta und Rückmeldungen

TreeView befindet sich aktuell in der Beta-Phase. Das Modul ist bereits recht umfangreich getestet, dennoch können natürlich noch Fehler auftreten oder sich Verbesserungsmöglichkeiten zeigen.

Über Rückmeldungen, Fehlermeldungen und Anregungen würde ich mich freuen.

Dokumentation: https://github.com/wowbagger60/TreeView/blob/main/README.de.md

Viel Spass beim Ausprobieren!

Ueli

[Mata_Encantada]

Hallo zusammen

TreeView 1.1 (Build 17) ist ab sofort als Beta im Module Store verfügbar. Nach der Testphase geht genau dieser Stand unverändert in den Stable-Kanal.

Was ist neu?

Einzelne Clients gezielt ansprechen
Bisher wirkten TREEV_SelectNode, TREEV_Expand, TREEV_Collapse, TREEV_ExpandAll und TREEV_CollapseAll immer auf alle geöffneten Visualisierungen. Dafür gibt es jetzt die neuen Funktionen …Ex, die nur einen bestimmten Client verändern. Die Client-ID bekommt ein Target-Script beim Klick auf einen Knoten automatisch übergeben:

<?php
$instance = (int) $_IPS['TREEV_INSTANCE'];
$client   = $_IPS['TREEV_CLIENT'];

// Nur auf dem Gerät, auf dem geklickt wurde
TREEV_ExpandEx($instance, $client, ['heizung']);
TREEV_SelectNodeEx($instance, $client, ['heizung', 'vorlauf']);

Die bisherigen Funktionen verhalten sich unverändert. Bitte beachten: TREEV_SelectNode öffnet ein hinterlegtes Ziel weiterhin auf allen Clients.

Auswahl bleibt erhalten
Speichern, Übernehmen der Konfiguration und TREEV_ClearRuntimeData löschen die Auswahl nicht mehr. Sie wird nur noch zurückgesetzt, wenn der ausgewählte Knoten oder einer seiner übergeordneten Knoten gelöscht wird.

MergeData aktualisiert bestehende Knoten
TREEV_MergeData fügt nicht mehr nur neue Knoten ein, sondern ändert auch bestehende. Es werden nur die übergebenen Felder angepasst, Unterknoten werden rekursiv zusammengeführt.

Weitere Verbesserungen

• Gelöschte Variablen oder Ziele machen die Instanz nicht mehr ungültig, sondern erscheinen als Warnung im Konfigurationsformular.
• Der obere Abstand passt sich automatisch an, je nachdem, ob ein Kacheltitel angezeigt wird.
• Die Verbindungslinien werden auch in älteren Browsern korrekt dargestellt.
• Die Meldungen sind vollständig übersetzt.
• Die Dokumentation ist überarbeitet.

Alle Details findet ihr in der Dokumentation auf GitHub: https://github.com/wowbagger60/TreeView

Wie immer freue ich mich über Rückmeldungen, Fehlerberichte und Ideen.

Gruss Ueli

---

[Mata_Encantada]

Hallo zusammen

TreeView 1.1 ist ab sofort im Stable-Kanal des Module Store verfügbar.

Die Neuerungen gegenüber 1.0 habe ich im Beitrag oben beschrieben. Seit der Beta (Build 17) ist noch eine Korrektur dazugekommen:

• Live-Werte springen nicht mehr auf den alten Wert zurück, wenn danach ein anderer Knoten ausgewählt wird. Das trat z. B. auf, wenn eine Variable über ein Target-Script geschaltet wurde.

Wer die Beta installiert hat, bekommt Build 18 als normales Update. Die Konfiguration bleibt erhalten.

Rückmeldungen, Fehlerberichte und Ideen sind weiterhin willkommen.

Die Dokumentation findet ihr auf GitHub:

TreeView/README.de.md

Gruss Ueli