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. [Gelöst] Iconfarbe abhängig von Stromabnahme

NEWS

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

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

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    2.0k

[Gelöst] Iconfarbe abhängig von Stromabnahme

Geplant Angeheftet Gesperrt Verschoben Visualisierung
17 Beiträge 2 Kommentatoren 1.3k Aufrufe 2 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.
  • liv-in-skyL liv-in-sky

    @crazy32

    ich dachte, dass pumpensymbol (das große icon) soll anzeigen, dass die steckdose an oder aus ist - wie soll sich dann die farbe ändern, wenn sie pumpt? eine dritte farbe ? - dann lassen wir doch lieber das große icon blinken oder ein/ausblenden, wenn die pumpe läuft (in grün, da ja die steckdose an ist und das symboleh schon grün ist)

    z.b. so:

    oberesbild: ein aus blenden

    unteres bild: blinken

    postit-dp (34).gif

    postit-dp (35).gif

    Crazy32C Offline
    Crazy32C Offline
    Crazy32
    schrieb am zuletzt editiert von
    #8

    @liv-in-sky Da habe ich mich wohl nicht richtig ausgedrückt. Der kleine runde Punkt oben links in der Ecke (in Deinem Screenshot weiß) zeigt an, ob die Steckdose online ist. Das Steckdosensymbol zeigt an, ob die Steckdose eingeschaltet ist. Das Pumpensymbol soll dann zeigen, ob die Pumpe gerade pumpt oder nicht. Und da wäre mir am liebsten das mit zwei Farben darzustellen. Die eine Farbe (z.B. Rot) soll darstellen, dass die Pumpe gerade nicht läuft und die andere Farbe (Grün) soll darstellen, dass sie aktuell läuft. Das Blinken auf Deinem unteren Bild gefällt mir. Bekommt man das so hin?:
    Pumpe läuft nicht = Pumpensymbol Rot
    Pumpe läuft = Pumpensymbol Grün und blinkend wie auf dem unteren Bild. Ansonsten nur Grün.

    liv-in-skyL 2 Antworten Letzte Antwort
    0
    • Crazy32C Crazy32

      @liv-in-sky Da habe ich mich wohl nicht richtig ausgedrückt. Der kleine runde Punkt oben links in der Ecke (in Deinem Screenshot weiß) zeigt an, ob die Steckdose online ist. Das Steckdosensymbol zeigt an, ob die Steckdose eingeschaltet ist. Das Pumpensymbol soll dann zeigen, ob die Pumpe gerade pumpt oder nicht. Und da wäre mir am liebsten das mit zwei Farben darzustellen. Die eine Farbe (z.B. Rot) soll darstellen, dass die Pumpe gerade nicht läuft und die andere Farbe (Grün) soll darstellen, dass sie aktuell läuft. Das Blinken auf Deinem unteren Bild gefällt mir. Bekommt man das so hin?:
      Pumpe läuft nicht = Pumpensymbol Rot
      Pumpe läuft = Pumpensymbol Grün und blinkend wie auf dem unteren Bild. Ansonsten nur Grün.

      liv-in-skyL Offline
      liv-in-skyL Offline
      liv-in-sky
      schrieb am zuletzt editiert von liv-in-sky
      #9

      @crazy32

      du kopierst das unter den CSS tab im vis editor

      .blink-green {
        animation: mdui-green-blink-ani 1s linear infinite;
      }
      @keyframes mdui-green-blink-ani  {
        0%,50% {filter: drop-shadow(0px 0px 4px #4CAF50) drop-shadow(0px 0px 4px #4CAF50) drop-shadow(0px 0px 4px #4CAF50); }
        51% {filter: none;}
      }
      

      Image 034.png

      dann kopierst du das (auswahl des widgets mit dem pumpen-icon):

      {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }
      
      

      dahin:
      Image 035.png

      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

      1 Antwort Letzte Antwort
      1
      • Crazy32C Crazy32

        @liv-in-sky Da habe ich mich wohl nicht richtig ausgedrückt. Der kleine runde Punkt oben links in der Ecke (in Deinem Screenshot weiß) zeigt an, ob die Steckdose online ist. Das Steckdosensymbol zeigt an, ob die Steckdose eingeschaltet ist. Das Pumpensymbol soll dann zeigen, ob die Pumpe gerade pumpt oder nicht. Und da wäre mir am liebsten das mit zwei Farben darzustellen. Die eine Farbe (z.B. Rot) soll darstellen, dass die Pumpe gerade nicht läuft und die andere Farbe (Grün) soll darstellen, dass sie aktuell läuft. Das Blinken auf Deinem unteren Bild gefällt mir. Bekommt man das so hin?:
        Pumpe läuft nicht = Pumpensymbol Rot
        Pumpe läuft = Pumpensymbol Grün und blinkend wie auf dem unteren Bild. Ansonsten nur Grün.

        liv-in-skyL Offline
        liv-in-skyL Offline
        liv-in-sky
        schrieb am zuletzt editiert von
        #10

        @crazy32

        die 2te formel war leider falsch - die 5 darf nicht in anführungszeichen sein

        muss so sein:

        
        
        {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }
        
         
        
        

        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

        Crazy32C 2 Antworten Letzte Antwort
        1
        • liv-in-skyL liv-in-sky

          @crazy32

          die 2te formel war leider falsch - die 5 darf nicht in anführungszeichen sein

          muss so sein:

          
          
          {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }
          
           
          
          
          Crazy32C Offline
          Crazy32C Offline
          Crazy32
          schrieb am zuletzt editiert von
          #11

          @liv-in-sky Die Pumpe ist zwischenzeitlich angesprungen und das Pumpensymbol ist von Rot auf Grün gesprungen und hat geblinkt. Top! Vielen Dank :+1:

          1 Antwort Letzte Antwort
          1
          • liv-in-skyL liv-in-sky

            @crazy32

            die 2te formel war leider falsch - die 5 darf nicht in anführungszeichen sein

            muss so sein:

            
            
            {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }
            
             
            
            
            Crazy32C Offline
            Crazy32C Offline
            Crazy32
            schrieb am zuletzt editiert von Crazy32
            #12

            @liv-in-sky Ich muss das Thema nochmal aufgreifen. Die beiden Icons weisen ein seltsames Verhalten auf. Allerdings erst, nachdem ich in den Widgets den Code für´s blinken hinterlegt habe. Hast Du eine Ahnung was das sein könnte?

            Hier noch ein Screenshot mit den Einträgen im Widget für Pumpe 1 und ein kurzes Video, das ist besser als irgendeine Beschreibung.

            Pumpe1.png
            Der komplette Text aus dem CSS-Feld des Widgets:
            {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }

            CSS.png

            https://photos.app.goo.gl/tmNkGV9kmjUXDyGg6

            liv-in-skyL 1 Antwort Letzte Antwort
            0
            • Crazy32C Crazy32

              @liv-in-sky Ich muss das Thema nochmal aufgreifen. Die beiden Icons weisen ein seltsames Verhalten auf. Allerdings erst, nachdem ich in den Widgets den Code für´s blinken hinterlegt habe. Hast Du eine Ahnung was das sein könnte?

              Hier noch ein Screenshot mit den Einträgen im Widget für Pumpe 1 und ein kurzes Video, das ist besser als irgendeine Beschreibung.

              Pumpe1.png
              Der komplette Text aus dem CSS-Feld des Widgets:
              {myVar:fritzdect.0.DECT_116570140122.power; myVar>5 ? "blink-green" : "" }

              CSS.png

              https://photos.app.goo.gl/tmNkGV9kmjUXDyGg6

              liv-in-skyL Offline
              liv-in-skyL Offline
              liv-in-sky
              schrieb am zuletzt editiert von
              #13

              @crazy32

              was nimmst du als anzeige - browser(welchen) oder die app

              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

              Crazy32C 1 Antwort Letzte Antwort
              0
              • liv-in-skyL liv-in-sky

                @crazy32

                was nimmst du als anzeige - browser(welchen) oder die app

                Crazy32C Offline
                Crazy32C Offline
                Crazy32
                schrieb am zuletzt editiert von Crazy32
                #14

                @liv-in-sky Auf dem Tablet nehme ich den Kiosk Browser, auf dem Raspi läuft Vivaldi. Der Effekt ist auf beiden zu sehen.

                liv-in-skyL 1 Antwort Letzte Antwort
                0
                • Crazy32C Crazy32

                  @liv-in-sky Auf dem Tablet nehme ich den Kiosk Browser, auf dem Raspi läuft Vivaldi. Der Effekt ist auf beiden zu sehen.

                  liv-in-skyL Offline
                  liv-in-skyL Offline
                  liv-in-sky
                  schrieb am zuletzt editiert von
                  #15

                  @crazy32 und in chrome auf dem pc?

                  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

                  Crazy32C 1 Antwort Letzte Antwort
                  0
                  • liv-in-skyL liv-in-sky

                    @crazy32 und in chrome auf dem pc?

                    Crazy32C Offline
                    Crazy32C Offline
                    Crazy32
                    schrieb am zuletzt editiert von Crazy32
                    #16

                    @liv-in-sky So, mal schnell durchgetestet. Das ist überall zu sehen, auf Vivaldi am PC, Vivaldi auf Android, Chrome auf PC, Chrome auf Android.
                    Edit: Und Firefox Nightly und Microsoft Edge

                    liv-in-skyL 1 Antwort Letzte Antwort
                    0
                    • Crazy32C Crazy32

                      @liv-in-sky So, mal schnell durchgetestet. Das ist überall zu sehen, auf Vivaldi am PC, Vivaldi auf Android, Chrome auf PC, Chrome auf Android.
                      Edit: Und Firefox Nightly und Microsoft Edge

                      liv-in-skyL Offline
                      liv-in-skyL Offline
                      liv-in-sky
                      schrieb am zuletzt editiert von
                      #17

                      @crazy32 ich kann es mittlerweile nachvollziehen

                      evtl mal ein image widget nehmen - 2 verschieden pump-symbole farbig definieren/downloaden/erstellen - und dann in der bildangabe auch wieder ein binding einfügen

                      hier mal ein image-widget mit 2 bindings - einmal verschiedene bilder und einmal das blinken

                      das bild ist so angegeben - mit meinen dp:

                      {myVar:0_userdata.0.CONTROL-OWN.AAATEST.TestLogic2; myVar=="true" ? "/vis.0/armin/img/pump-green.png" : "/vis.0/armin/img/pump-red.png" }
                      

                      [{"tpl":"tplImage","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"src":"{myVar:0_userdata.0.CONTROL-OWN.AAATEST.TestLogic2; myVar==\"true\" ? \"/vis.0/armin/img/pump-green.png\" : \"/vis.0/armin/img/pump-red.png\" }","class":"{myVar:0_userdata.0.CONTROL-OWN.AAATEST.wert1#wert1; myVar>5 ? \"blink-green\" : \"\" }"},"style":{"left":"925px","top":"386px","width":"70px","height":"72px"},"widgetSet":"basic"}]
                      

                      die pumpenbilder zum download


                      pump-green.png pump-red.png

                      scheint stabile zu laufen - auch in fully browser

                      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

                      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

                      294

                      Online

                      32.6k

                      Benutzer

                      82.0k

                      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