Skip to content
  • Home
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • 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

  • Default (No Skin)
  • No Skin
Collapse
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Skripten / Logik
  4. Bindingsabhängige Farbbereiche

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    18
    1
    784

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    18
    1
    6.2k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.5k

Bindingsabhängige Farbbereiche

Scheduled Pinned Locked Moved Skripten / Logik
13 Posts 4 Posters 1.1k Views 3 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • ub.privatU Offline
    ub.privatU Offline
    ub.privat
    wrote on last edited by
    #1

    Guten Morgen an alle Programmierer und Wissensträger!

    Ich arbeite mich langsam in die Welt des ioBroker ein und bin nun bei den Bindings hängen geblieben.
    In der Visu möchte ich gern Zustände (Zahlen des DP) entsprechend ihres Wertebereiches anzeigen.
    Bei einer Temperatur < 21°C - blau, =21°C - grün und bei >21°C - rot.

    Nun schaut es bei mir wie folgt aus:

    {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : "#6abf69" ; wert > 21 ? "#ff6659" : "#6abf69"}
    

    Es will aber nicht wirklich umschalten. Kann es sein, dass die zweite Abfrage anstatt durch ";" mit einem "ODER" getrennt sein muss?

    bahnuhrB 1 Reply Last reply
    0
    • ub.privatU ub.privat

      Guten Morgen an alle Programmierer und Wissensträger!

      Ich arbeite mich langsam in die Welt des ioBroker ein und bin nun bei den Bindings hängen geblieben.
      In der Visu möchte ich gern Zustände (Zahlen des DP) entsprechend ihres Wertebereiches anzeigen.
      Bei einer Temperatur < 21°C - blau, =21°C - grün und bei >21°C - rot.

      Nun schaut es bei mir wie folgt aus:

      {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : "#6abf69" ; wert > 21 ? "#ff6659" : "#6abf69"}
      

      Es will aber nicht wirklich umschalten. Kann es sein, dass die zweite Abfrage anstatt durch ";" mit einem "ODER" getrennt sein muss?

      bahnuhrB Offline
      bahnuhrB Offline
      bahnuhr
      Forum Testing Most Active
      wrote on last edited by
      #2

      @ub-privat sagte in Bindingsabhängige Farbbereiche:

      {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : "#6abf69" ; wert > 21 ? "#ff6659" : "#6abf69"}

      probiers mal so:

      {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : wert > 21 ? "#ff6659" : "#6abf69"} 
      

      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

      ub.privatU 1 Reply Last reply
      0
      • bahnuhrB bahnuhr

        @ub-privat sagte in Bindingsabhängige Farbbereiche:

        {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : "#6abf69" ; wert > 21 ? "#ff6659" : "#6abf69"}

        probiers mal so:

        {wert:hm-rpc.2.0006D788585C0B.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : wert > 21 ? "#ff6659" : "#6abf69"} 
        
        ub.privatU Offline
        ub.privatU Offline
        ub.privat
        wrote on last edited by
        #3

        @bahnuhr

        danke für deine schnelle Antwort. Leider ohne Erfolg...
        Wenn die Zahl Kommastellen hat, muss ich dann auch mit 20.0 und 21.0 arbeiten?

        1 Reply Last reply
        0
        • bahnuhrB Offline
          bahnuhrB Offline
          bahnuhr
          Forum Testing Most Active
          wrote on last edited by
          #4

          Hier ein Binding von mir; dies funktioniert einwandfrei.

          {v:javascript.0.Geräte.Wemos.Wemos-Drucksensor.Sensor_05_Heizung;v<1.4?"red":v<1.6?"orange":v>2?"orange":v>2.2?"red":"#00FF00"}
          

          Das o.g. Binding sieht gut aus.
          Dann machst du irgendetwas anders.

          Welches Widget hast du?
          Wo trägst du dies ein (Hardcopy)?


          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

          ub.privatU 1 Reply Last reply
          0
          • bahnuhrB bahnuhr

            Hier ein Binding von mir; dies funktioniert einwandfrei.

            {v:javascript.0.Geräte.Wemos.Wemos-Drucksensor.Sensor_05_Heizung;v<1.4?"red":v<1.6?"orange":v>2?"orange":v>2.2?"red":"#00FF00"}
            

            Das o.g. Binding sieht gut aus.
            Dann machst du irgendetwas anders.

            Welches Widget hast du?
            Wo trägst du dies ein (Hardcopy)?

            ub.privatU Offline
            ub.privatU Offline
            ub.privat
            wrote on last edited by
            #5

            @bahnuhr

            ... habs jetzt hinbekommen!
            Aber noch eine kleine Frage. Wie kann ich größer/gleich und kleiner/gleich anwenden?
            Wann muss ich in der Programmierung Leerzeichen verwenden?

            {wert:hm-rpc.2.0006D788585F67.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : wert > 21 ? "#ff6659" : "#6abf69"} 					
            

            Bei dir sind diese nicht vorhanden.

            bahnuhrB 2 Replies Last reply
            0
            • ub.privatU ub.privat

              @bahnuhr

              ... habs jetzt hinbekommen!
              Aber noch eine kleine Frage. Wie kann ich größer/gleich und kleiner/gleich anwenden?
              Wann muss ich in der Programmierung Leerzeichen verwenden?

              {wert:hm-rpc.2.0006D788585F67.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : wert > 21 ? "#ff6659" : "#6abf69"} 					
              

              Bei dir sind diese nicht vorhanden.

              bahnuhrB Offline
              bahnuhrB Offline
              bahnuhr
              Forum Testing Most Active
              wrote on last edited by bahnuhr
              #6

              @ub-privat sagte in Bindingsabhängige Farbbereiche:

              Wie kann ich größer/gleich und kleiner/gleich anwenden?

              versteh ich nicht.

              wie in Mathe üblich, also
              v<=1.4
              oder
              v>=1.4

              oder du machst gleich eine Und - Prüfung, so:
              {v:javascript.0.Geräte.Wemos.Wemos-Wohnzimmer.CO2;(v>1000&&v<=1500) ? "#51a0f5": "rgb(255, 255, 255)"}


              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

              ub.privatU 1 Reply Last reply
              0
              • ub.privatU ub.privat

                @bahnuhr

                ... habs jetzt hinbekommen!
                Aber noch eine kleine Frage. Wie kann ich größer/gleich und kleiner/gleich anwenden?
                Wann muss ich in der Programmierung Leerzeichen verwenden?

                {wert:hm-rpc.2.0006D788585F67.1.ACTUAL_TEMPERATURE; wert < 20 ? "#63a4ff" : wert > 21 ? "#ff6659" : "#6abf69"} 					
                

                Bei dir sind diese nicht vorhanden.

                bahnuhrB Offline
                bahnuhrB Offline
                bahnuhr
                Forum Testing Most Active
                wrote on last edited by
                #7

                @ub-privat sagte in Bindingsabhängige Farbbereiche:

                Wann muss ich in der Programmierung Leerzeichen verwenden?

                Ich habe gar keine Leerzeichen.


                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

                HomoranH ub.privatU 2 Replies Last reply
                0
                • bahnuhrB bahnuhr

                  @ub-privat sagte in Bindingsabhängige Farbbereiche:

                  Wann muss ich in der Programmierung Leerzeichen verwenden?

                  Ich habe gar keine Leerzeichen.

                  HomoranH Do not disturb
                  HomoranH Do not disturb
                  Homoran
                  Global Moderator Administrators
                  wrote on last edited by
                  #8

                  @bahnuhr sagte in Bindingsabhängige Farbbereiche:

                  @ub-privat sagte in Bindingsabhängige Farbbereiche:

                  Wann muss ich in der Programmierung Leerzeichen verwenden?

                  Ich habe gar keine Leerzeichen.

                  Das sagt @ub-privat ja

                  @ub-privat sagte in Bindingsabhängige Farbbereiche:

                  Bei dir sind diese nicht vorhanden.

                  kein Support per PN! - Fragen im Forum stellen -
                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                  Das Forum freut sich über eine Spende. Benutzt dazu den Spendenbutton oben rechts. Danke!
                  der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                  1 Reply Last reply
                  0
                  • bahnuhrB bahnuhr

                    @ub-privat sagte in Bindingsabhängige Farbbereiche:

                    Wie kann ich größer/gleich und kleiner/gleich anwenden?

                    versteh ich nicht.

                    wie in Mathe üblich, also
                    v<=1.4
                    oder
                    v>=1.4

                    oder du machst gleich eine Und - Prüfung, so:
                    {v:javascript.0.Geräte.Wemos.Wemos-Wohnzimmer.CO2;(v>1000&&v<=1500) ? "#51a0f5": "rgb(255, 255, 255)"}

                    ub.privatU Offline
                    ub.privatU Offline
                    ub.privat
                    wrote on last edited by
                    #9

                    @bahnuhr

                    eigentlich logisch - denkt man?! ;-) Wenn du so schreibst, kann ich nur zustimmen und habe wieder gelernt.
                    Die UND-Prüfung ist auch sehr gut, habe ich schon angewandt (Füllstand Zisterne), klappt super.

                    Danke!

                    1 Reply Last reply
                    0
                    • bahnuhrB bahnuhr

                      @ub-privat sagte in Bindingsabhängige Farbbereiche:

                      Wann muss ich in der Programmierung Leerzeichen verwenden?

                      Ich habe gar keine Leerzeichen.

                      ub.privatU Offline
                      ub.privatU Offline
                      ub.privat
                      wrote on last edited by
                      #10

                      @bahnuhr

                      na dann werde ich in der syntax noch ein wenig Ordnung schaffen... Auch hierfür DANKE.

                      OmnedonO 1 Reply Last reply
                      0
                      • bahnuhrB Offline
                        bahnuhrB Offline
                        bahnuhr
                        Forum Testing Most Active
                        wrote on last edited by
                        #11

                        Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                        Danke.


                        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

                        1 Reply Last reply
                        1
                        • ub.privatU ub.privat

                          @bahnuhr

                          na dann werde ich in der syntax noch ein wenig Ordnung schaffen... Auch hierfür DANKE.

                          OmnedonO Offline
                          OmnedonO Offline
                          Omnedon
                          wrote on last edited by
                          #12

                          @ub-privat
                          Hallo,
                          ich hatte was Ähnliches vorgehabt, aber mit mehr Farben im spiel und das auch für mehrere Widgets.
                          Hier ist das Problem, dass man die dann einzeln anpassen muss, wenn man an den Farbwerten Änderungen machen möchte.

                          Ich habe das so gelöst.

                          1. Im Widget selbst z.B bei Background-color rufe ich eine JavaScript Funktion "TempToColor"
                          {n:hm-rpc.5.000E9569A32000.1.ACTUAL_TEMPERATURE; TempToColor(n)}
                          
                          1. Hinzufügen der JavaScript-Funktion in den "Script"-Tab:

                          372ae027-0c4c-40aa-8c46-240104e30b30-image.png

                          function TempToColor(n)
                          {
                              var rgb = Hex2Deci('A9F5A9');
                              
                              if (n > 50)         rgb = Hex2Deci('8B0000');
                              else if (n >= 40)    rgb = Hex2Deci('CD0000');
                              else if (n >= 35)    rgb = Hex2Deci('FF0000');
                              else if (n >= 30)    rgb = Hex2Deci('FF6347');
                              else if (n >= 25)    rgb = Hex2Deci('edd0d4');
                              else if (n >= 20)    rgb = Hex2Deci('00FF00');
                              else if (n >= 15)    rgb = Hex2Deci('A9F5A9');
                              else if (n >= 10)    rgb = Hex2Deci('CEECF5');
                              else if (n >= 5)     rgb = Hex2Deci('A9E2F3');
                              else if (n >= 0)     rgb = Hex2Deci('81BEF7');
                              else if (n >= -5)    rgb = Hex2Deci('2E64FE');
                              else if (n >= -10)   rgb = Hex2Deci('0000FF');
                              else                rgb = Hex2Deci('08088A');
                          
                              return 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')'; 
                          }
                          
                          function Hex2Deci(hex) // Hexadezimal nach Dezimal
                          {
                              var r, g, b, hr, hg, hb;
                              
                              hr = hex.substr(0,2);
                              r = parseInt(hr,16);
                              
                              hg = hex.substr(2,2);
                              g = parseInt(hg,16);
                          
                              hb = hex.substr(4,2);
                              b = parseInt(hb,16);
                          
                              return [r, g, b];
                          }
                          

                          Ich hoffe das hilft ebenfalls.
                          Viele Grüße

                          ub.privatU 1 Reply Last reply
                          1
                          • OmnedonO Omnedon

                            @ub-privat
                            Hallo,
                            ich hatte was Ähnliches vorgehabt, aber mit mehr Farben im spiel und das auch für mehrere Widgets.
                            Hier ist das Problem, dass man die dann einzeln anpassen muss, wenn man an den Farbwerten Änderungen machen möchte.

                            Ich habe das so gelöst.

                            1. Im Widget selbst z.B bei Background-color rufe ich eine JavaScript Funktion "TempToColor"
                            {n:hm-rpc.5.000E9569A32000.1.ACTUAL_TEMPERATURE; TempToColor(n)}
                            
                            1. Hinzufügen der JavaScript-Funktion in den "Script"-Tab:

                            372ae027-0c4c-40aa-8c46-240104e30b30-image.png

                            function TempToColor(n)
                            {
                                var rgb = Hex2Deci('A9F5A9');
                                
                                if (n > 50)         rgb = Hex2Deci('8B0000');
                                else if (n >= 40)    rgb = Hex2Deci('CD0000');
                                else if (n >= 35)    rgb = Hex2Deci('FF0000');
                                else if (n >= 30)    rgb = Hex2Deci('FF6347');
                                else if (n >= 25)    rgb = Hex2Deci('edd0d4');
                                else if (n >= 20)    rgb = Hex2Deci('00FF00');
                                else if (n >= 15)    rgb = Hex2Deci('A9F5A9');
                                else if (n >= 10)    rgb = Hex2Deci('CEECF5');
                                else if (n >= 5)     rgb = Hex2Deci('A9E2F3');
                                else if (n >= 0)     rgb = Hex2Deci('81BEF7');
                                else if (n >= -5)    rgb = Hex2Deci('2E64FE');
                                else if (n >= -10)   rgb = Hex2Deci('0000FF');
                                else                rgb = Hex2Deci('08088A');
                            
                                return 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')'; 
                            }
                            
                            function Hex2Deci(hex) // Hexadezimal nach Dezimal
                            {
                                var r, g, b, hr, hg, hb;
                                
                                hr = hex.substr(0,2);
                                r = parseInt(hr,16);
                                
                                hg = hex.substr(2,2);
                                g = parseInt(hg,16);
                            
                                hb = hex.substr(4,2);
                                b = parseInt(hb,16);
                            
                                return [r, g, b];
                            }
                            

                            Ich hoffe das hilft ebenfalls.
                            Viele Grüße

                            ub.privatU Offline
                            ub.privatU Offline
                            ub.privat
                            wrote on last edited by
                            #13

                            @omnedon

                            Na das schau ich mir ebenefalls an! Dafür habe ich auch schon eine Anwendung!
                            Besten Dank.

                            Das Script wird direkt dem Widget zugeordnet, wo das "Farbspiel" zur Anwendung kommt?

                            1 Reply Last reply
                            0

                            Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                            Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                            With your input, this post could be even better 💗

                            Register Login
                            Reply
                            • Reply as topic
                            Log in to reply
                            • Oldest to Newest
                            • Newest to Oldest
                            • Most Votes


                            Support us

                            ioBroker
                            Community Adapters
                            Donate

                            354

                            Online

                            32.8k

                            Users

                            82.7k

                            Topics

                            1.3m

                            Posts
                            Community
                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                            ioBroker Community 2014-2025
                            logo
                            • Login

                            • Don't have an account? Register

                            • Login or register to search.
                            • First post
                              Last post
                            0
                            • Home
                            • Recent
                            • Tags
                            • Unread 0
                            • Categories
                            • Unreplied
                            • Popular
                            • GitHub
                            • Docu
                            • Hilfe