Weiter zum Inhalt
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Hell
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dunkel
  • 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. [gelöst] Button Hintergrundfarbe nach Wert ändern

NEWS

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

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

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

[gelöst] Button Hintergrundfarbe nach Wert ändern

Geplant Angeheftet Gesperrt Verschoben Visualisierung
vis
12 Beiträge 3 Kommentatoren 1.4k Aufrufe 6 Beobachtet
  • Ä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.
  • TG70T TG70

    Hallo, ich bin auf der Suche nach einer Lösung, wie ich einem Button/Widget je nach Wert eine andere Hintgergrundfarbe zuordnen kann (z.B. für Stromverbrauch/Luftfeuchtigkeit/uws.)
    Ich würde ca. 10 verschiedene Farben einplanen wollen.

    Beispiel: 0-200 Watt = grün / 200-300 W = Cyan / 300-400 W = Gelb / 400-500 W = Orange/ usw.
    

    Habe zwar den "Justgage Colored" gefunden, welcher aber nur 3 Farben darstellen kann :(

    1f09b735-ebe1-4843-b566-524b12d3a674-grafik.png

    J.A.R.V.I.S.J Offline
    J.A.R.V.I.S.J Offline
    J.A.R.V.I.S.
    Developer
    schrieb am zuletzt editiert von
    #2

    @TG70 schau dir mal folgendes an: https://github.com/ioBroker/ioBroker.vis#bindings-of-objects

    Bzw. such mal im Forum danach. Es gab schön des öfteren solche Themen.

    https://forum.iobroker.net/topic/22232/signalbilder-css-klassen/4

    TG70T 1 Antwort Letzte Antwort
    0
    • J.A.R.V.I.S.J J.A.R.V.I.S.

      @TG70 schau dir mal folgendes an: https://github.com/ioBroker/ioBroker.vis#bindings-of-objects

      Bzw. such mal im Forum danach. Es gab schön des öfteren solche Themen.

      https://forum.iobroker.net/topic/22232/signalbilder-css-klassen/4

      TG70T Offline
      TG70T Offline
      TG70
      Forum Testing
      schrieb am zuletzt editiert von TG70
      #3

      Wollte gerade schreiben, dass ich es wohl geschaft habe?
      Habe folgendes in den "Hintergrund" geschrieben

      {v:hm-rpc.0.MEQ0705683.1.POWER;((v/100)<2) ? "green": ((v/100)<3) ? "yellow": ((v/100)<4) ? "blue": ((v/100)<5) ? "red": ((v/100)<6) ? "#e633a6": "white"}
      

      ∘ MB ASRock J4105M Intel J4105 CPU M-ATX | 16 GB RAM | 480 GB SSD ∘ PROXMOX LCX-Container > IoBroker

      TG70T 1 Antwort Letzte Antwort
      0
      • TG70T TG70

        Wollte gerade schreiben, dass ich es wohl geschaft habe?
        Habe folgendes in den "Hintergrund" geschrieben

        {v:hm-rpc.0.MEQ0705683.1.POWER;((v/100)<2) ? "green": ((v/100)<3) ? "yellow": ((v/100)<4) ? "blue": ((v/100)<5) ? "red": ((v/100)<6) ? "#e633a6": "white"}
        
        TG70T Offline
        TG70T Offline
        TG70
        Forum Testing
        schrieb am zuletzt editiert von TG70
        #4

        Soweit so gut. Bei einem Luftfeuchtigkeitswer habe ich jetzt ein Problem - vielleicht denke ich hier falsch:

        hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY
        Wert: 42%

        Die Farben sollen so aufgeteilt werden:
        0-34% rot
        35-39% gelb
        40-60 %grün
        61-65 %gelb
        66-100% rot

        So dachte ich das es funktionieren könnte - aber irgendwo ist der Wurm drin:

        {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v/100)<0.35) ? "red": ((v/100)<0.4) ? "yellow": ((v/100)<0.6) ? "green": ((v/100)<0.65) ? "yellow": ((v/100)<1.0) ? "red“: "black"}
        

        Ein Weiteres Problem ist mit einem Luftdruck Tendenz . Welcher mit
        drei Strings angezeigt wird. Hier sollen die Farben so vergeben werden:
        Dazu habe ich noch gar keine Idee:

        Blau >> up
        grün >> stable
        rot >> down

        ∘ MB ASRock J4105M Intel J4105 CPU M-ATX | 16 GB RAM | 480 GB SSD ∘ PROXMOX LCX-Container > IoBroker

        J.A.R.V.I.S.J 2 Antworten Letzte Antwort
        0
        • TG70T TG70

          Soweit so gut. Bei einem Luftfeuchtigkeitswer habe ich jetzt ein Problem - vielleicht denke ich hier falsch:

          hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY
          Wert: 42%

          Die Farben sollen so aufgeteilt werden:
          0-34% rot
          35-39% gelb
          40-60 %grün
          61-65 %gelb
          66-100% rot

          So dachte ich das es funktionieren könnte - aber irgendwo ist der Wurm drin:

          {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v/100)<0.35) ? "red": ((v/100)<0.4) ? "yellow": ((v/100)<0.6) ? "green": ((v/100)<0.65) ? "yellow": ((v/100)<1.0) ? "red“: "black"}
          

          Ein Weiteres Problem ist mit einem Luftdruck Tendenz . Welcher mit
          drei Strings angezeigt wird. Hier sollen die Farben so vergeben werden:
          Dazu habe ich noch gar keine Idee:

          Blau >> up
          grün >> stable
          rot >> down

          J.A.R.V.I.S.J Offline
          J.A.R.V.I.S.J Offline
          J.A.R.V.I.S.
          Developer
          schrieb am zuletzt editiert von
          #5

          @TG70 ich habe zunächst eine Frage: Gibt es einen Grund, dass du den Wert erst durch 100 teilst?

          Zudem müsstest du nicht nur < sondern <= verwenden, damit du die richtigen Farben zu den richtigen Werten erhälst.

          TG70T 1 Antwort Letzte Antwort
          1
          • TG70T TG70

            Soweit so gut. Bei einem Luftfeuchtigkeitswer habe ich jetzt ein Problem - vielleicht denke ich hier falsch:

            hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY
            Wert: 42%

            Die Farben sollen so aufgeteilt werden:
            0-34% rot
            35-39% gelb
            40-60 %grün
            61-65 %gelb
            66-100% rot

            So dachte ich das es funktionieren könnte - aber irgendwo ist der Wurm drin:

            {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v/100)<0.35) ? "red": ((v/100)<0.4) ? "yellow": ((v/100)<0.6) ? "green": ((v/100)<0.65) ? "yellow": ((v/100)<1.0) ? "red“: "black"}
            

            Ein Weiteres Problem ist mit einem Luftdruck Tendenz . Welcher mit
            drei Strings angezeigt wird. Hier sollen die Farben so vergeben werden:
            Dazu habe ich noch gar keine Idee:

            Blau >> up
            grün >> stable
            rot >> down

            J.A.R.V.I.S.J Offline
            J.A.R.V.I.S.J Offline
            J.A.R.V.I.S.
            Developer
            schrieb am zuletzt editiert von
            #6

            @TG70 sagte in Button Hintergrundfarbe je nach Wert ändern:

            Welcher mit
            drei Strings angezeigt wird.

            Du kannst einen Vergleich machen.

            (v == 'up') ? 'blue' : ... usw. 
            
            1 Antwort Letzte Antwort
            1
            • J.A.R.V.I.S.J J.A.R.V.I.S.

              @TG70 ich habe zunächst eine Frage: Gibt es einen Grund, dass du den Wert erst durch 100 teilst?

              Zudem müsstest du nicht nur < sondern <= verwenden, damit du die richtigen Farben zu den richtigen Werten erhälst.

              TG70T Offline
              TG70T Offline
              TG70
              Forum Testing
              schrieb am zuletzt editiert von
              #7

              Ja gute Frage, das habe ich mich beim oberen Script auch schon gefragt.... habe ich so gefunden und war sehr froh das es funktioniert hatte

              Meinst du etwa so - funktioniert aber nicht - was hab ich noch falsch :

              {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v <=35) ? "red": ((v <=40) ? "yellow": ((v <=60) ? "green": ((v <=65) ? "yellow": ((v <=100) ? "red“: "black"}
              

              ∘ MB ASRock J4105M Intel J4105 CPU M-ATX | 16 GB RAM | 480 GB SSD ∘ PROXMOX LCX-Container > IoBroker

              ? J.A.R.V.I.S.J 2 Antworten Letzte Antwort
              0
              • TG70T TG70

                Ja gute Frage, das habe ich mich beim oberen Script auch schon gefragt.... habe ich so gefunden und war sehr froh das es funktioniert hatte

                Meinst du etwa so - funktioniert aber nicht - was hab ich noch falsch :

                {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v <=35) ? "red": ((v <=40) ? "yellow": ((v <=60) ? "green": ((v <=65) ? "yellow": ((v <=100) ? "red“: "black"}
                
                ? Offline
                ? Offline
                Ein ehemaliger Benutzer
                schrieb am zuletzt editiert von
                #8

                @TG70 stimmen deinen Klammern? Ich glaub du machst zuviel auf und nicht mehr zu 🤔

                1 Antwort Letzte Antwort
                1
                • TG70T TG70

                  Ja gute Frage, das habe ich mich beim oberen Script auch schon gefragt.... habe ich so gefunden und war sehr froh das es funktioniert hatte

                  Meinst du etwa so - funktioniert aber nicht - was hab ich noch falsch :

                  {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;((v <=35) ? "red": ((v <=40) ? "yellow": ((v <=60) ? "green": ((v <=65) ? "yellow": ((v <=100) ? "red“: "black"}
                  
                  J.A.R.V.I.S.J Offline
                  J.A.R.V.I.S.J Offline
                  J.A.R.V.I.S.
                  Developer
                  schrieb am zuletzt editiert von J.A.R.V.I.S.
                  #9

                  @TG70 da hat @HeinrichB recht. Du hast vergessen, die eine von zwei Klammern vor dem v zu entfernen.

                  TG70T 1 Antwort Letzte Antwort
                  1
                  • J.A.R.V.I.S.J J.A.R.V.I.S.

                    @TG70 da hat @HeinrichB recht. Du hast vergessen, die eine von zwei Klammern vor dem v zu entfernen.

                    TG70T Offline
                    TG70T Offline
                    TG70
                    Forum Testing
                    schrieb am zuletzt editiert von
                    #10

                    Jep ihr hattet natürlich Recht - die Klammern waren das Problem ... DANKE EUCH

                    {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;(v<35) ? "red": (v<40) ? "yellow": (v<61) ? "green": (v<66) ? "yellow": (v<100) ? "red": "white"}
                    

                    ∘ MB ASRock J4105M Intel J4105 CPU M-ATX | 16 GB RAM | 480 GB SSD ∘ PROXMOX LCX-Container > IoBroker

                    J.A.R.V.I.S.J 1 Antwort Letzte Antwort
                    0
                    • TG70T TG70

                      Jep ihr hattet natürlich Recht - die Klammern waren das Problem ... DANKE EUCH

                      {v:hm-rpc.0.MEQ0237123.2.ACTUAL_HUMIDITY;(v<35) ? "red": (v<40) ? "yellow": (v<61) ? "green": (v<66) ? "yellow": (v<100) ? "red": "white"}
                      
                      J.A.R.V.I.S.J Offline
                      J.A.R.V.I.S.J Offline
                      J.A.R.V.I.S.
                      Developer
                      schrieb am zuletzt editiert von
                      #11

                      @TG70 sollte deine Frage damit gelöst sein, dann kannst du zum einen ein "[gelöst]" in den Titel setzen und zum anderen die Lösung als Lösung makieren. Damit wird es für andere einfacher, eine gleiche oder ähnliche Problemstellung hier zu finden.

                      TG70T 1 Antwort Letzte Antwort
                      0
                      • J.A.R.V.I.S.J J.A.R.V.I.S.

                        @TG70 sollte deine Frage damit gelöst sein, dann kannst du zum einen ein "[gelöst]" in den Titel setzen und zum anderen die Lösung als Lösung makieren. Damit wird es für andere einfacher, eine gleiche oder ähnliche Problemstellung hier zu finden.

                        TG70T Offline
                        TG70T Offline
                        TG70
                        Forum Testing
                        schrieb am zuletzt editiert von
                        #12

                        Ja gelöst. Übringes die Tendenz funkioniert auch so wie du gesagt hast . Danke für deinen Tip

                        {v:netatmo.0.home-mühe.Indoor.Pressure.PressureTrend;(v == 'up') ? "blue": (v == 'stable') ? "green": (v == 'down') ? "purple": "grey"}
                        

                        ∘ MB ASRock J4105M Intel J4105 CPU M-ATX | 16 GB RAM | 480 GB SSD ∘ PROXMOX LCX-Container > IoBroker

                        1 Antwort Letzte Antwort
                        0

                        Hey! Du scheinst an dieser Unterhaltung interessiert zu sein, hast aber noch kein Konto.

                        Hast du es satt, bei jedem Besuch durch die gleichen Beiträge zu scrollen? Wenn du dich für ein Konto anmeldest, kommst du immer genau dorthin zurück, wo du zuvor warst, und kannst dich über neue Antworten benachrichtigen lassen (entweder per E-Mail oder Push-Benachrichtigung). Du kannst auch Lesezeichen speichern und Beiträge positiv bewerten, um anderen Community-Mitgliedern deine Wertschätzung zu zeigen.

                        Mit deinem Input könnte dieser Beitrag noch besser werden 💗

                        Registrieren Anmelden
                        Antworten
                        • In einem neuen Thema antworten
                        Anmelden zum Antworten
                        • Älteste zuerst
                        • Neuste zuerst
                        • Meiste Stimmen


                        Support us

                        ioBroker
                        Community Adapters
                        Donate

                        365

                        Online

                        32.8k

                        Benutzer

                        82.7k

                        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