HACS Gauges (Tachoanzeigen)

[Tom Bombadil]

Kurze Frage: Ist jemandem eine Gauge / Tachoanzeige über den Weg gelaufen, wo statt fester Farben auch Farbverläufe angegeben werden können? Ich möchte in meiner Helios Integration diese KWL Anzeige mit dynamisch errechneten DIN-Lüftungsvolumina darstellen (Feuchteschutz / Grundlüftung / Normallüftung / Stosslüftung). Allerdings soll rot in gelb übergehen, gelb in grün usw (also ein Gradient statt einer einzelnen festen Einzelfarbe pro Bereich). Leider noch nix gefunden - die Standard-Gauge fällt aus, da man die Einzelbereiche nicht per cardmod adressieren kann, und die plotly Gauge fällt aus, weil sie keinen Zeiger hat ...

/tom

[Tom Bombadil]

Nun gut - nicht wirklich schick, aber es kommt der Idee langsam näher, sogar mit der eingebauten Lovelace-Gauge, wenn auch mit viel Code:

image.png

Unschöner 'hack', aber dieses Tool hilft bei den Abstufungen der Farben, die man als Segmente im YAML einfügen kann: https://ha.labtool.pl/en.lims. Immer noch besser als alles, was man mit plotly / highcharts etc pp erreichen kann.

Es scheint wirklich keine Gauge Standard-Karte mit echtem Gradient/Farbverlauf zu geben. Schade. Nehm ich mir vielleicht mal demnächst mal selbst zur Brust. Und bevor es jemand kommentiert: Ja, meine KWL ist tatsächlich überdmensioniert - wie die meisten, die verbaut wurden.

/tom

[scw2wi]

Es scheint wirklich keine Gauge Standard-Karte mit echtem Gradient/Farbverlauf zu geben.

Es gibt eine (eigentlich schon wieder 8 Monate alte) neue Gauge, und diese kann auch einen Farbverlauf (und noch vieles mehr).

Modern Circular Gauge

Optisch ähnlich ist sie der Flex Horseshoe Card, mit etwas weniger Konfigurationsmöglichkeiten, diese aber dafür wesentlich einfacher und die meisten auch über das GUI.

Zusätzlich kann sie, wie die Dual Gauge Card auch einen zweiten Wert anzeigen, und sogar auch noch einen dritten. Man kann auch wählen, ob die zusätzlichen Werte als eigene Skala, in der gleichen Skala oder nur als Wert angezeigt werden sollen.

Die Template Fähigkeit für Name, Wert und Icon bietet auch viele zusätzliche Möglichkeiten, die man bei anderen Cards vermisst.

Es gibt sie nicht nur als Card, sondern auch als Badge. Bis jetzt habe ich bei meinem Dashboard noch keine Badges verwendet, aber diese Anzeige macht sich auch als kleines Badge-Icon echt gut.

Hier mein erster Entwurf als Card mit jeweils 2 Werten, links mit Standard Farbsegmenten, rechts mit Verlauf (smooth_segments: true).

modern-circular-gauge.png
Man kann deutlich erkennen, dass beim Verlauf die Farbübergänge nach links verschoben werden, das muss man bei der Festlegung der Übergänge dann entsprechend kompensieren.

Hier noch Teile vom Code, der gesamte Code ist attached.

name: Außen / Innen - Temperatur
show_header: true
header_position: bottom​

Den Header zeige ich unten an, da er oben zu knapp platziert wird und unten ohnehin viel Platz frei bleibt.
Die Schriftgröße konnte ich bisher nicht einmal mit card-mod anpassen, da müssen wohl die Profis ran.

label: Außen
needle: true
show_state: true
show_unit: true
show_icon: false
adaptive_state_color: true​

Wenn man sich nur 2 Werte anzeigen lässt, dann kann man diese (nur über YAML, nicht übers GUI) mit einem Label versehen, bei 3 Werten geht das nicht mehr.
Die Needle wird als Punkt dargestellt, nicht als Nadel, was bei mehreren Skalen ja auch Sinn macht.
show_state zeigt den Wert selbst an, show_unit auch die Einheit dazu, show_icon gibt es nur für den Hauptwert (ist hier aber ausgeblendet).
adaptive_state_color zeigt den Wert immer in der Farbe entsprechend der Skala an, adaptive_icon_color kann das gleiche auch fürs Icon.

Der 2. Wert wird unterhalb und der 3. Wert oberhalb angezeigt.
Wenn man auf den 3. Wert verzichtet, dann kann man den 2. Wert mit "state_size: big" gleich groß wie den Hauptwert anzeigen.

Die Farben var(--gauge-background-color) stammen von meinem Theme, das ich hier im Forum aber noch nicht beschrieben habe. Es können aber auch Farbnamen verwendet werden, in meinem Fall sind das: SkyBlue, LightGreen, Khaki, SandyBrown, LightCoral.

Wenn die Karte weiterhin regelmäßig Updates erhält, wird sie bald mein Favorit für jene Anzeigen, wo ich auf eine Skala verzichten kann.

[Tom Bombadil]

Schau Dir auch mal die gauge-card-pro an - ebenfalls mit Gradient. Eigentlich noch recht jung (war mit dem Entwickler von Anfang an in Kontakt), aber sehr vielversprechend, da sie quasi das look&feel der orginalen Gauge Karte hat und sich optisch damit gut in bestehende Umgebungen einfügt. Ich werde sie definitiv bei mir als optionale Karte in die Helios-Vallox Integration einbauen - da musste ich für Gradienten bisher richtige Klimmzüge machen (siehe oben), und wirklich schick waren die Gauges trotzdem nicht.

/tom

p.s./edit: Und Templates können da in vielen Parametern sogar auch verwendet werden, was die originale Gauge Card ja auch nicht kann.

[scw2wi]

Vielen Dank für den Super-Tipp, ich hab die gleiche Aufgabe von oben jetzt auch mit der Gauge-Card-Pro gelöst.

gauge-card-pro.png

Je nach Anwendungsfall wird mal die eine und mal die andere Card besser sein.
Die Farbübergänge sind hier ebenfalls verschoben, der Autor hat das aber recht gut begründet, und man kann es ja sehr einfach anpassen.

Was hier gut gelöst ist: Man kann viele Einstellungen wie Textfarbe und Größe direkt über Parameter (also ohne Card-Mod) anpassen. So etwas würde ich mir bei vielen anderen Cards ebenfalls wünschen.

Meine Monitoring page ist durch dieser Card jetzt deutlich aufgewertet worden.

Monitoring.png

adaptive_state_color geht mir hier jedoch ab. Man kann es zwar etwas umständlicher über Template-Trigger lösen, hat dann aber leider harte Farbübergänge beim angezeigten Wert.