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. Visualisierung
  4. VIS Background Color mit Datenpunkt steuern

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

VIS Background Color mit Datenpunkt steuern

Scheduled Pinned Locked Moved Visualisierung
vis
26 Posts 9 Posters 3.4k Views 6 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.
  • K Offline
    K Offline
    kaiserm
    wrote on last edited by
    #1

    Moinsen,

    mal ne kurze Frage an die Cracks.

    Wie kann ich die Backgound Color eines numerischen Feldes in der VIS per Datenpunkt ändern?

    Also wenn der Datenpunkt true ist z.B. rot und bei false = grün

    Den Datenpunkt habe ich schon.
    Aber was muss ichwo und wie reinklöppen damit die Farbe geändert wird?

    Danke im Voraus

    Martin

    1 Reply Last reply
    0
    • K Offline
      K Offline
      kaiserm
      wrote on last edited by
      #2

      Ist doch bestimmt ein Klacks.

      Helft mir bitte mal auf die Sprünge :-)

      arteckA 1 Reply Last reply
      0
      • M Online
        M Online
        micklafisch
        wrote on last edited by
        #3

        Hallo,
        ich würde mir da selbst via "quick&dirty" helfen, indem ich das Widget zwei mal in der Vis habe. Einmal mit grün und einmal mit roten Hintergrund. Unter "Sichtbarkeit" dann entsprechend den Datenpunkt auswerten und nur die Farbe anzeigen lassen die korrekt zum Datenpunkt ist.

        Das ganze geht bestimmt auch schöner und eleganter, aber meine Version geht auch :blush:

        1 Reply Last reply
        0
        • K kaiserm

          Ist doch bestimmt ein Klacks.

          Helft mir bitte mal auf die Sprünge :-)

          arteckA Offline
          arteckA Offline
          arteck
          Developer Most Active
          wrote on last edited by
          #4

          @kaiserm binding ist hier das stichwort

          zigbee hab ich, zwave auch, nuc's genauso und HA auch

          K 1 Reply Last reply
          1
          • arteckA arteck

            @kaiserm binding ist hier das stichwort

            K Offline
            K Offline
            kaiserm
            wrote on last edited by
            #5

            @arteck Bahnhof? :-)

            liv-in-skyL 1 Reply Last reply
            0
            • K kaiserm

              @arteck Bahnhof? :-)

              liv-in-skyL Offline
              liv-in-skyL Offline
              liv-in-sky
              wrote on last edited by liv-in-sky
              #6

              @kaiserm

              wenn du das hier in der vis in ein feld einträgst ( mit deinen parametern) benutzt du das sog. binding

              {val:javascript.0.ProofingDatapoints.RunSuccessful; val == "true"  ?   "#5A5555":  "#000000"}
              

              übersetzt: wenn der datenpunkt "javascript.0.ProofingDatapoints.RunSuccessful" true ist, nutze #5A5555 sonst #000000

              Image 1.png

              test2.gif

              https://github.com/ioBroker/ioBroker.vis

              nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

              W 1 Reply Last reply
              2
              • K Offline
                K Offline
                kaiserm
                wrote on last edited by
                #7

                @liv-in-sky said in VIS Background Color mit Datenpunkt steuern:

                {val:javascript.0.ProofingDatapoints.RunSuccessful; val == "true" ? "#5A5555": "#000000"}

                Mega. Vielen Dank.
                Funktioniert einwandfrei.

                Gibt es irgendwo eine Übersicht über die ganzen Bindings, wenn ich z.B. Text ändern, Bilder wechseln,... möchte?

                LG Martin

                liv-in-skyL 1 Reply Last reply
                0
                • K kaiserm

                  @liv-in-sky said in VIS Background Color mit Datenpunkt steuern:

                  {val:javascript.0.ProofingDatapoints.RunSuccessful; val == "true" ? "#5A5555": "#000000"}

                  Mega. Vielen Dank.
                  Funktioniert einwandfrei.

                  Gibt es irgendwo eine Übersicht über die ganzen Bindings, wenn ich z.B. Text ändern, Bilder wechseln,... möchte?

                  LG Martin

                  liv-in-skyL Offline
                  liv-in-skyL Offline
                  liv-in-sky
                  wrote on last edited by
                  #8

                  @kaiserm im link unter dem animated bild sind offizielle angaben

                  ansonsten würd ich dir empfehlen - einfach ausprobieren - die syntax ist ja eigentlich immer ähnlich

                  oder im forum suchen

                  nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                  K 1 Reply Last reply
                  0
                  • liv-in-skyL liv-in-sky

                    @kaiserm im link unter dem animated bild sind offizielle angaben

                    ansonsten würd ich dir empfehlen - einfach ausprobieren - die syntax ist ja eigentlich immer ähnlich

                    oder im forum suchen

                    K Offline
                    K Offline
                    kaiserm
                    wrote on last edited by
                    #9

                    @liv-in-sky Alles klaro. Danke Dir.

                    1 Reply Last reply
                    0
                    • liv-in-skyL liv-in-sky

                      @kaiserm

                      wenn du das hier in der vis in ein feld einträgst ( mit deinen parametern) benutzt du das sog. binding

                      {val:javascript.0.ProofingDatapoints.RunSuccessful; val == "true"  ?   "#5A5555":  "#000000"}
                      

                      übersetzt: wenn der datenpunkt "javascript.0.ProofingDatapoints.RunSuccessful" true ist, nutze #5A5555 sonst #000000

                      Image 1.png

                      test2.gif

                      https://github.com/ioBroker/ioBroker.vis

                      W Offline
                      W Offline
                      warp735
                      wrote on last edited by warp735
                      #10

                      @liv-in-sky

                      Ich hab aktuell folgendes laufen, was auch gut funktioniert:

                      -webkit-linear-gradient(-45deg, #ffd633 0%,#ffcc00 100%)
                      

                      Nun möchte ich den gradienten behalten, aber je nach Datenpunkt die Farbe wechseln. Folgendes funktioniert aber leider nicht:

                      {val:modbus.0.holdingRegisters.1080_ETA_Schalter; val == "1802" ? "-webkit-linear-gradient(-45deg, #ffd633 0% , #ffcc00 100%)" : "-webkit-linear-gradient(-45deg, red 0% , blue 100%)"} 
                      

                      Geht das garnicht, wie ich mir das vorstelle?

                      Grüßle

                      OliverIOO 1 Reply Last reply
                      0
                      • W warp735

                        @liv-in-sky

                        Ich hab aktuell folgendes laufen, was auch gut funktioniert:

                        -webkit-linear-gradient(-45deg, #ffd633 0%,#ffcc00 100%)
                        

                        Nun möchte ich den gradienten behalten, aber je nach Datenpunkt die Farbe wechseln. Folgendes funktioniert aber leider nicht:

                        {val:modbus.0.holdingRegisters.1080_ETA_Schalter; val == "1802" ? "-webkit-linear-gradient(-45deg, #ffd633 0% , #ffcc00 100%)" : "-webkit-linear-gradient(-45deg, red 0% , blue 100%)"} 
                        

                        Geht das garnicht, wie ich mir das vorstelle?

                        Grüßle

                        OliverIOO Offline
                        OliverIOO Offline
                        OliverIO
                        wrote on last edited by
                        #11

                        @warp735 sagte in VIS Background Color mit Datenpunkt steuern:

                        webkit-linear-gradient

                        sollte so schon funktionieren.
                        was funktioniert genau nicht?

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

                        W 1 Reply Last reply
                        0
                        • OliverIOO OliverIO

                          @warp735 sagte in VIS Background Color mit Datenpunkt steuern:

                          webkit-linear-gradient

                          sollte so schon funktionieren.
                          was funktioniert genau nicht?

                          W Offline
                          W Offline
                          warp735
                          wrote on last edited by warp735
                          #12

                          @oliverio
                          Er zeigt überhaupt keine Farbe an :-(

                          EDIT: Kommando zurück. Es funktioniert tatsächlich. Allerdings nicht im Editor. Wenn ich die VIS lade sieht es super aus.
                          Vielen Dank :+1:

                          OliverIOO 1 Reply Last reply
                          0
                          • W warp735

                            @oliverio
                            Er zeigt überhaupt keine Farbe an :-(

                            EDIT: Kommando zurück. Es funktioniert tatsächlich. Allerdings nicht im Editor. Wenn ich die VIS lade sieht es super aus.
                            Vielen Dank :+1:

                            OliverIOO Offline
                            OliverIOO Offline
                            OliverIO
                            wrote on last edited by
                            #13

                            @warp735
                            bindings funktionieren nie im editor nur in der runtime

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

                            skvarelS 1 Reply Last reply
                            0
                            • W Offline
                              W Offline
                              warp735
                              wrote on last edited by
                              #14

                              @oliverio
                              Was das editieren der VIS natürlich erheblich erschwert. Muss man dann halt erst zum Schluss setzen

                              A 1 Reply Last reply
                              0
                              • W warp735

                                @oliverio
                                Was das editieren der VIS natürlich erheblich erschwert. Muss man dann halt erst zum Schluss setzen

                                A Offline
                                A Offline
                                adarof
                                wrote on last edited by adarof
                                #15

                                Hallo
                                Ich versuche gerade irgendwie die Bindings zum laufen zu bekommen - aber scheitere einfach an dem einfachsten Beispiel.
                                Hat jemand eine idee?
                                Folgender Datenpunkt:
                                e5169399-2347-4749-85b9-0feafe1f4f63-image.png
                                datenunkt per Copy aus dem Objekt-Browser:

                                0_userdata.0.Test
                                

                                Und folgende VIS html widget mit Background-"Binding":
                                0459db5b-4b09-49cc-97fc-2f972aacf12d-image.png
                                Wobei "background" folgenden Wert hat:

                                {val:0_userdata.0.Test ; val ==  0 ? "#5A5555": "#ff0000"}
                                

                                (Ja, in dem Vis Mode (nicht Editor) tut es auch nicht - der Hintergrund bleibt weiss, wie im Editor)

                                Muss ich das Feature "Binding" noch irgendwie EINschalten oder so? Denke ich hab ganz am Anfang was nicht verstanden ...

                                gruss - Adarof

                                HomoranH 1 Reply Last reply
                                0
                                • A adarof

                                  Hallo
                                  Ich versuche gerade irgendwie die Bindings zum laufen zu bekommen - aber scheitere einfach an dem einfachsten Beispiel.
                                  Hat jemand eine idee?
                                  Folgender Datenpunkt:
                                  e5169399-2347-4749-85b9-0feafe1f4f63-image.png
                                  datenunkt per Copy aus dem Objekt-Browser:

                                  0_userdata.0.Test
                                  

                                  Und folgende VIS html widget mit Background-"Binding":
                                  0459db5b-4b09-49cc-97fc-2f972aacf12d-image.png
                                  Wobei "background" folgenden Wert hat:

                                  {val:0_userdata.0.Test ; val ==  0 ? "#5A5555": "#ff0000"}
                                  

                                  (Ja, in dem Vis Mode (nicht Editor) tut es auch nicht - der Hintergrund bleibt weiss, wie im Editor)

                                  Muss ich das Feature "Binding" noch irgendwie EINschalten oder so? Denke ich hab ganz am Anfang was nicht verstanden ...

                                  gruss - Adarof

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

                                  @adarof sagte in VIS Background Color mit Datenpunkt steuern:

                                  Folgender Datenpunkt:

                                  bestätige den Wert mal

                                  kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                  der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                                  A 1 Reply Last reply
                                  0
                                  • HomoranH Homoran

                                    @adarof sagte in VIS Background Color mit Datenpunkt steuern:

                                    Folgender Datenpunkt:

                                    bestätige den Wert mal

                                    A Offline
                                    A Offline
                                    adarof
                                    wrote on last edited by
                                    #17

                                    @homoran
                                    Keine Änderung
                                    ff5c8e34-16e3-44ff-9d36-963bfe6f1828-image.png
                                    ergibt immernoch
                                    ffa2dfad-a472-49ea-875b-2f7cc692e2fd-image.png
                                    ...und ich erwarte ja, dass egal ob if oder else eine Farbe gesetzt wird.

                                    Gruss -

                                    HomoranH 2 Replies Last reply
                                    0
                                    • A adarof

                                      @homoran
                                      Keine Änderung
                                      ff5c8e34-16e3-44ff-9d36-963bfe6f1828-image.png
                                      ergibt immernoch
                                      ffa2dfad-a472-49ea-875b-2f7cc692e2fd-image.png
                                      ...und ich erwarte ja, dass egal ob if oder else eine Farbe gesetzt wird.

                                      Gruss -

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

                                      @adarof warum hast du die Farbe in Anführungszeichen?

                                      edit: ist ok so!

                                      kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                      der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                                      1 Reply Last reply
                                      0
                                      • A adarof

                                        @homoran
                                        Keine Änderung
                                        ff5c8e34-16e3-44ff-9d36-963bfe6f1828-image.png
                                        ergibt immernoch
                                        ffa2dfad-a472-49ea-875b-2f7cc692e2fd-image.png
                                        ...und ich erwarte ja, dass egal ob if oder else eine Farbe gesetzt wird.

                                        Gruss -

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

                                        @adarof :face_palm:

                                        falsches Feld!
                                        eins tiefer in color!

                                        kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                                        Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                        der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                                        A 1 Reply Last reply
                                        0
                                        • HomoranH Homoran

                                          @adarof :face_palm:

                                          falsches Feld!
                                          eins tiefer in color!

                                          A Offline
                                          A Offline
                                          adarof
                                          wrote on last edited by
                                          #20

                                          @homoran Ahh - Danke; das wars. Nun tut das Test Widget. Dankeschön :-)
                                          Das hatte ich in den Dokus anders verstanden - und eigentlich auch ausprobiert ... nun kommt das ABER:
                                          Bei mir tut das nur mit Anführungsstrichen um die Farbe selber-- und die Kombi (Feld -color mit Anführungszeichen) hab ich hoffensichtlich gestern nicht probiert vor meiner Hilfssuche :v:

                                          Und schon tut es auch, was es soll im eigentlichen Anwendungsfall:
                                          55e4123d-7b85-4711-bdbb-ddb83ac8df97-image.png
                                          (eAuto ist bei 80% geladen und lädt gerade mit 4.6kWh weiter)
                                          Wird gemacht bei mir durch:

                                          {val:evcc.0.loadpoint.1.status.chargeCurrent ; val >=  0 ? "#49ff24" : "#ffffff" }
                                          
                                          OliverIOO 1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          841

                                          Online

                                          32.4k

                                          Users

                                          81.5k

                                          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