Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Binding: Textfarbe nach Wert

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.8k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.2k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    16
    1
    3.3k

Binding: Textfarbe nach Wert

Geplant Angeheftet Gesperrt Verschoben Visualisierung
17 Beiträge 8 Kommentatoren 2.5k Aufrufe 7 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • SBorgS SBorg

    @gammler2003 sagte in Binding: Textfarbe nach Wert:

    In VIS Edit ändert sich die Farbe auch genau so wie sie soll

    Hi, da scheint schon der Fehler zu sein. Bindings werden nur zur Laufzeit ausgeführt (Runtime), nie im Editor.
    Da aber mein "Glaskugelmodus" ( ;) ) leider offline ist, wäre, um besser helfen zu können, mehr Infos nötig wie zB. mal dein Binding.
    Bindings funktionieren mit unter auch nicht im verwendeten Widget. Zum testen eignet sich das einfache "HTML-Widget". Dort kann man sich dann auch zuerst mal das Ergebnis des Bindings als Text ausgeben lassen.

    G Offline
    G Offline
    gammler2003
    schrieb am zuletzt editiert von
    #8

    @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

    Das Binding sieht wie folgt aus:

    {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
    

    Eingetragen unter CSS Font & Text/ color

    OliverIOO SBorgS 2 Antworten Letzte Antwort
    0
    • G gammler2003

      @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

      Das Binding sieht wie folgt aus:

      {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
      

      Eingetragen unter CSS Font & Text/ color

      OliverIOO Offline
      OliverIOO Offline
      OliverIO
      schrieb am zuletzt editiert von
      #9

      @gammler2003 sagte in Binding: Textfarbe nach Wert:

      {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}

      im Beispiel von eben, denke ich, hat sich noch ein Fehler eingeschlichen, da um das cool sicherlich auch Anführungsstriche gehören.

      {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"}
      

      Damit die Funktionsweiße genau verstanden wird, hier nochmal eine Detailerklärung
      Bei Binding können mehrere Befehle hintereinander geschrieben werden. Die einzelnen Befehle werden mit einem ; getrennt.
      Zur Unterscheidung von anderen Angaben in den jeweiligen Felders müssen Binding-Anweisungen mit geschweiften Klammern eingeschlossen werden. Davor und danach können troztdem gültige Angaben gemacht werden.
      Anhand des Beispiels:

      wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode
      Der Inhalt des Datenpunkts wird in die Variable wert gepseichert und kann unter diesem namen weiter verwendet werden

      wert == "cool" ? "#1874CD" : "#ff0000"
      

      Diese Anweisung ist meist etwas schwer zu lesen, gibt es aber in mehrere Programmiersprachen und nennt sich ternärer Operator. Der Operator hat 3 Teile, die jeweils durch das ? und den : getrennt wird.

      Der erste Teil (vor dem Fragezeichen) ist eine Vergleichsoperation, bei der Wahr oder Falsch herauskommen muss (allerdings hat javascript da so seine besonderheiten. Bei Interesse kann man mal unter falsy und truthy nachschlagen).
      Hier wird der Inhalt von Wert mit dem Text "cool" verglichen. Wenn cool drin steht ist die Prüfung wahr, ansonsten falsch.

      Der nächste Teil nach dem Fragezeichen und vor dem Doppelpunkt ist die Anweisung, die ausgeführt wird, wenn die Prüfung im ersten Teil wahr ist.

      Der Teil nach dem Doppelpunkt ist die Anweisung, die ausgeführt wird, wenn die Prüfung falsch ergibt.

      Jetzt kann man das auch noch ineinander verschachteln, so das da sehr komplexe Anweisungen herauskommen, die kaum noch lesbar sind, aber durchaus funktionieren.

      Das Ergebnis dieses ternären Operators kann entweder in einer nachfolgenden Anweisung (nach einem weiteren Strichpunkt weiterverarbeitet werden. Gibt es keine weitere Anweisung, dann wird das Ergebnis einfach mit dem Inhalt der geschweiften Klammern ersetzt.

      bspw in einem html-Feld kann man folgendes machen

      der wert im datenpunk ist {val:wert:javascript.0.test1;val=="1"?"eins":"nicht eins"}
      

      wenn der datenpunkt 1 enthält, dann wird
      der wert im datenpunk ist eins
      ausgegeben, ansonsten
      der wert im datenpunk ist nicht eins
      ausgegeben.

      weitere infos zu binding hier
      https://github.com/ioBroker/ioBroker.vis

      Meine Adapter und Widgets
      TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
      Links im Profil

      1 Antwort Letzte Antwort
      2
      • G gammler2003

        @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

        Das Binding sieht wie folgt aus:

        {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
        

        Eingetragen unter CSS Font & Text/ color

        SBorgS Offline
        SBorgS Offline
        SBorg
        Forum Testing Most Active
        schrieb am zuletzt editiert von
        #10

        @gammler2003 gibt eigentlich nichts zu ergänzen, @OliverIO hat es schon ausführlich erklärt, bis auf das C&P-Monster (oder auch einfach C&P-Fehler) beim Beispiel:

        der wert im datenpunk ist {val:javascript.0.test1;val=="1"?"eins":"nicht eins"} 
        

        funktioniert besser :grinning:

        Bei deinem Binding passiert folgendes:

        {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"} 
        

        Es wird die Variable wert (=der Inhalt des vorher definierten Datenpunktes) mit der Variablen cool verglichen ob sie gleich ist. cool hast du aber nicht als Variable definiert, sondern willst wohl eher vergleichen ob der Inhalt deines Datenpunktes "cool" ist.
        Deswegen

        {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"} 
        

        Wenn du dies nun in ein HTM-Widget als "Inhalt" einträgst, wirst du sehen, dass die Ausgabe sich je nach Inhalt deines abgefragten Datenpunktes ändert. Beim falschen Binding dagegen wird sie immer "#ff0000" lauten.

        Die Farbe des Textes im Editor wird sich auch nicht in Abhängigkeit des Datenpunktes ändern. Das ist mehr Zufall, denn wenn du wie hier in den Eigenschaften (text-color) ein Binding einträgst, interpretiert der Editor einfach den ersten Farbwert (bei dir dann #1874CD) den er im Binding findet ohne das Binding wirklich auszuführen ;)

        LG SBorg ( SBorg auf GitHub)
        Projekte: Lebensmittelwarnung.de | WLAN-Wetterstation | PimpMyStation

        OliverIOO 1 Antwort Letzte Antwort
        0
        • SBorgS SBorg

          @gammler2003 gibt eigentlich nichts zu ergänzen, @OliverIO hat es schon ausführlich erklärt, bis auf das C&P-Monster (oder auch einfach C&P-Fehler) beim Beispiel:

          der wert im datenpunk ist {val:javascript.0.test1;val=="1"?"eins":"nicht eins"} 
          

          funktioniert besser :grinning:

          Bei deinem Binding passiert folgendes:

          {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"} 
          

          Es wird die Variable wert (=der Inhalt des vorher definierten Datenpunktes) mit der Variablen cool verglichen ob sie gleich ist. cool hast du aber nicht als Variable definiert, sondern willst wohl eher vergleichen ob der Inhalt deines Datenpunktes "cool" ist.
          Deswegen

          {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"} 
          

          Wenn du dies nun in ein HTM-Widget als "Inhalt" einträgst, wirst du sehen, dass die Ausgabe sich je nach Inhalt deines abgefragten Datenpunktes ändert. Beim falschen Binding dagegen wird sie immer "#ff0000" lauten.

          Die Farbe des Textes im Editor wird sich auch nicht in Abhängigkeit des Datenpunktes ändern. Das ist mehr Zufall, denn wenn du wie hier in den Eigenschaften (text-color) ein Binding einträgst, interpretiert der Editor einfach den ersten Farbwert (bei dir dann #1874CD) den er im Binding findet ohne das Binding wirklich auszuführen ;)

          OliverIOO Offline
          OliverIOO Offline
          OliverIO
          schrieb am zuletzt editiert von
          #11

          @sborg sagte in Binding: Textfarbe nach Wert:

          funktioniert besser

          stimmt

          Meine Adapter und Widgets
          TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
          Links im Profil

          G 1 Antwort Letzte Antwort
          0
          • OliverIOO OliverIO

            @sborg sagte in Binding: Textfarbe nach Wert:

            funktioniert besser

            stimmt

            G Offline
            G Offline
            gammler2003
            schrieb am zuletzt editiert von
            #12

            @oliverio @SBorg
            Ich verneige mich und sage ganz herzlichen Dank für eure Hilfe. Es funktioniert!

            1 Antwort Letzte Antwort
            0
            • G Offline
              G Offline
              G.Hawk
              schrieb am zuletzt editiert von
              #13

              Hallo

              Ich habe eine kurze Frage dazu:

              Wenn ich mehrere Bedingunggen einfüge, also wenn dann, wenn dann, sonst.
              Wie muss ich das schreiben?

              Das funktioniert nicht:

              {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "#B5B5B5" : "#FF0000"; wert == "On" ? "#00FF00" : "#0000CD" }
              

              Also Z.B: Wenn "Standby" dann grau, Wenn "on" dann grün usw........ sonst rot.

              Er soll die Textfarbe ändern bei "Standby" und "on".
              Das möchte ich später noch erweitern, deshalb möchte ich gern verstehen, wie das funktioniert.

              Nächste Frage wäre ob ich den Datenpunkt immer reinschreiben muss oder ob er sich den von der ObjektID automatisch holt, das habe ich oben nicht ganz vertanden.

              Gruß

              bahnuhrB 1 Antwort Letzte Antwort
              0
              • G G.Hawk

                Hallo

                Ich habe eine kurze Frage dazu:

                Wenn ich mehrere Bedingunggen einfüge, also wenn dann, wenn dann, sonst.
                Wie muss ich das schreiben?

                Das funktioniert nicht:

                {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "#B5B5B5" : "#FF0000"; wert == "On" ? "#00FF00" : "#0000CD" }
                

                Also Z.B: Wenn "Standby" dann grau, Wenn "on" dann grün usw........ sonst rot.

                Er soll die Textfarbe ändern bei "Standby" und "on".
                Das möchte ich später noch erweitern, deshalb möchte ich gern verstehen, wie das funktioniert.

                Nächste Frage wäre ob ich den Datenpunkt immer reinschreiben muss oder ob er sich den von der ObjektID automatisch holt, das habe ich oben nicht ganz vertanden.

                Gruß

                bahnuhrB Offline
                bahnuhrB Offline
                bahnuhr
                Forum Testing Most Active
                schrieb am zuletzt editiert von
                #14

                @g-hawk sagte in Binding: Textfarbe nach Wert:

                deshalb möchte ich gern verstehen, wie das funktioniert.

                Es funktioniert so wie jede andere if then Abfrage.

                {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "grau" : wert == "on" ? "grün" : "rot" }
                

                Die Farben noch ersetzen durch deine #..

                Du schreibt in der Bedingung on groß; aber im Text klein.
                Was ist nun richtig ?

                @g-hawk sagte in Binding: Textfarbe nach Wert:

                ob ich den Datenpunkt immer reinschreiben muss

                ja, du musst ja der Variablen "wert" etwas zuweisen (kann ja auch was anderes sein).


                Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                Danke.
                gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                ScreenToGif :https://www.screentogif.com/downloads.html

                G 1 Antwort Letzte Antwort
                1
                • bahnuhrB bahnuhr

                  @g-hawk sagte in Binding: Textfarbe nach Wert:

                  deshalb möchte ich gern verstehen, wie das funktioniert.

                  Es funktioniert so wie jede andere if then Abfrage.

                  {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "grau" : wert == "on" ? "grün" : "rot" }
                  

                  Die Farben noch ersetzen durch deine #..

                  Du schreibt in der Bedingung on groß; aber im Text klein.
                  Was ist nun richtig ?

                  @g-hawk sagte in Binding: Textfarbe nach Wert:

                  ob ich den Datenpunkt immer reinschreiben muss

                  ja, du musst ja der Variablen "wert" etwas zuweisen (kann ja auch was anderes sein).

                  G Offline
                  G Offline
                  G.Hawk
                  schrieb am zuletzt editiert von
                  #15

                  @bahnuhr

                  Super danke es klappt einwandrei.

                  1 Antwort Letzte Antwort
                  0
                  • G Offline
                    G Offline
                    G.Hawk
                    schrieb am zuletzt editiert von
                    #16

                    Eine Frage habe ich noch.
                    Kann soetwas irgendwie klappen wenn ich das bei Box Shaddow unter CSS Schatten und Abstand eintrage?

                    {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "box-shadow:inset 0px 0px 10px #FFFFFF" : "box-shadow:inset 0px 0px 10px #39db00" }
                    
                    G 1 Antwort Letzte Antwort
                    0
                    • G G.Hawk

                      Eine Frage habe ich noch.
                      Kann soetwas irgendwie klappen wenn ich das bei Box Shaddow unter CSS Schatten und Abstand eintrage?

                      {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "box-shadow:inset 0px 0px 10px #FFFFFF" : "box-shadow:inset 0px 0px 10px #39db00" }
                      
                      G Offline
                      G Offline
                      G.Hawk
                      schrieb am zuletzt editiert von
                      #17

                      @g-hawk

                      Frage selbst beantwortet.

                      {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "inset 0px 0px 10px #FFFFFF" : "inset 0px 0px 10px #39db00" }
                      

                      Klappt!

                      1 Antwort Letzte Antwort
                      0
                      Antworten
                      • In einem neuen Thema antworten
                      Anmelden zum Antworten
                      • Älteste zuerst
                      • Neuste zuerst
                      • Meiste Stimmen


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      413

                      Online

                      32.4k

                      Benutzer

                      81.5k

                      Themen

                      1.3m

                      Beiträge
                      Community
                      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                      ioBroker Community 2014-2025
                      logo
                      • Anmelden

                      • Du hast noch kein Konto? Registrieren

                      • Anmelden oder registrieren, um zu suchen
                      • Erster Beitrag
                        Letzter Beitrag
                      0
                      • Home
                      • Aktuell
                      • Tags
                      • Ungelesen 0
                      • Kategorien
                      • Unreplied
                      • Beliebt
                      • GitHub
                      • Docu
                      • Hilfe