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.9k

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

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

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.
  • G gammler2003

    Hallo zusammen,

    auch ich nutze binding um die Textfarbe in einem Basic String Widget in meiner VIS zu ändern. In VIS Edit ändert sich die Farbe auch genau so wie sie soll - in der VIS Anzeige (egal ob Iphone-App oder wie Browser) ist die Textfarbe einfach nur schwarz. Refresh der VIS-Anzeige hilft nicht.

    Wenn ich die Textfarbe statisch ändere (also einfach einen Hex-Code eingebe und nicht über binding) wird die Farbe in der Anzeige korrekt angezeigt.

    Hat jemand eine Idee? Vielen Dank euch.

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

    @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.

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

    G 1 Antwort Letzte Antwort
    0
    • 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 Online
                  bahnuhrB Online
                  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

                        758

                        Online

                        32.4k

                        Benutzer

                        81.6k

                        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