Widget mit wechselnden Farben je nach Wert des Datenpunktes
-
Ich möchte in einem Widget Temperaturwerte als Zahl anzeigen. Der Hintergrund soll dabei - abhängig von der Temperatur - verschiedene Farben annehmen. Das ganze soll dann etwa so aussehen, die die Farbdarstellung auf Wetterkarten.
Gíbt es so etwas als fertiges Widget?
-
Nein, aber Mittel CSS realisierbar
Sent from my iPhone using Tapatalk
-
Hmm… da ist es wieder, mein Problem. :roll:
Vielleicht hat ja hier jemand so etwas schion mal realisiert und greift mir unter die Arme.
-
Kann mir da vielleicht mal jemand helfen. CSS ist für mich ein böhmisches Dorf.
Die Anforderung:
Im VIS soll ein rechteckiges Kästchen zu sehen sein, das je nach Wert des bezogenen Datenpunktes seine Farbe ändert.
Ich weiss nicht, ob man da ein vorhandenes Widget als Basis nehmen kann:
Das "jqui-mfd - Custom 10" kann so etwas prinzipiell. Die 10 Stufen würden mir reichen. Wenn man da SVG Widgets einsetzt, kann man deren Farbe wie gewünscht ändern. Aber eben nur die Farbe der Icons.
Danke schon mal.
-
Hintergründe kannst du doch in Abhängigkeit vom Wert eines Datenpunktes ändern. Ich muss erst raussuchen, wie das genau geschreiben wird.
In etwa {a:name des Objektes; a=0 dann #00ff00; a=10…} die genaue Schreibweise weiß ich jetzt nicht aus dem Kopf. Damit kann jedenfalls in Stufen die Hintergrundfarbe geändert werden, wenn es nicht allzu viele Stufen werden sollen.
Enrico
-
Hallo,
es kommt darauf an, welche Bereich du gern in welcher Farbe darstellen willst.
Generell rate ich dir zu einem kleinen Javascript, das genau das macht. Später bindest du den Datenpunkt, der im Script erstellt wird, einfach im Bereich background-color des Widgets ein.
Wenn es nur um 3 Stufen geht (zB grün orange rot) gibt es das justgage value & indicator widget. Damit gehts ohne Skript.
Hier ein Beispiel der Einstellungen:
Wenn deine Quellwerte ganze Zahlen sind, kannst du auch zB ein HTML Value List Widget verwenden. Damit lässt sich pro Wert genauestens oper CSS das Aussehen gestalten.
Man kann auch Skript und ValueList kombinieren. Im Skript wird per Abfrage für jede Temperatur ein Stufe definiert (1 bis 10) und dann im ValueListWidget für jede Stufe die entsprechende Farbe in VIS. Dann brauchst du das Skript später nicht mehr anzufassen.
Aber dennoch musst die Beziehungen Temperatur und Farbe, die dir vorschweben mal preisgeben.
Gruß
Pix
-
Moin!
Ich hatte mal das gleiche Problem und von Java und CSS auch keine Ahnung.
Deshalb habe ich es ganz einfach wie folgt realisiert.
Einfach zwei Widgets mit verschiedenen Farben übereinander gelegt und entsprechend einem bestimmt Wert auf sichtbar geschaltet oder nicht.
Geht bestimmt auch anders, aber so funktioniert es zumindest.
-
@pix:Aber dennoch musst die Beziehungen Temperatur und Farbe, die dir vorschweben mal preisgeben… `
Naja, in Wetterkarten werden Temperaturen ja von Violett kommend (starker Frost) über Blau- und Grüntöne bis hin zu Orange- und Rottönen (extreme Hitze) farblich dargestellt.
Ich möchte auf einer VIS-Seite Temperaturen, die von einem Sensor kommen mit einer solchen Farbskala hinterlegen.
Dein Vorschlag, pix, das per Objekt zu machen, dem ich per Javascript den Farbwert gebe und diesen dann im Widget zu übernehmen, halte ich am praktikabelsten - zumindest für meinen Wissensstand.
Was mir dazu nur fehlt:
-
steht dann die Farbe im Format #ffffff im Objekt?
-
was trage ich dann im Widget unter Background ein, um diesen Wert aus dem Objekt zu holen?
Gruß
Manfred
-
-
Hallo,
nimm mal den Value Indikator….
-
Danke für den Tipp Sigi, aber dieses Widget kann doch nur drei verschiedene Farben?
Um es noch mal ganz deutlich zu machen hier mal ein Bild, in dem alle Farben dargestellt sind. Oben ist die Skala (hier in Fahrenheit), an die ich mich anlehnen möchte:
