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. Vorlagen/Ideen MüllPlan VIEW / Widget ?

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    16
    1
    231

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

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

Vorlagen/Ideen MüllPlan VIEW / Widget ?

Scheduled Pinned Locked Moved Visualisierung
vis
317 Posts 41 Posters 70.0k Views 49 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.
  • ChaotC Chaot

    @haus-automatisierung Danke. Das ist eine gute Sache.
    Hast du eventuell eine kleine Anleitung wie man die Farebn hinterlegt? Ich habe absolut keine Ahnung von CSS

    haus-automatisierungH Online
    haus-automatisierungH Online
    haus-automatisierung
    Developer Most Active
    wrote on last edited by
    #153

    @Chaot Hier mal ein Screenshot meiner Config

    Screenshot 2020-03-07 at 21.44.05.png

    Die Hex-Werte für die Farben suchst Du einfach mit einem beliebigen Color Picker aus. Zum Beispiel bei Google nach "Color Picker" suchen.

    🧑‍🎓 Autor des beliebten ioBroker-Master-Kurses
    🎥 Tutorials rund um das Thema DIY-Smart-Home: https://haus-automatisierung.com/
    📚 Meine inoffizielle ioBroker Dokumentation

    ChaotC liv-in-skyL 2 Replies Last reply
    0
    • haus-automatisierungH haus-automatisierung

      @Chaot Hier mal ein Screenshot meiner Config

      Screenshot 2020-03-07 at 21.44.05.png

      Die Hex-Werte für die Farben suchst Du einfach mit einem beliebigen Color Picker aus. Zum Beispiel bei Google nach "Color Picker" suchen.

      ChaotC Offline
      ChaotC Offline
      Chaot
      wrote on last edited by Chaot
      #154

      @haus-automatisierung Oh mann! Und ich suche die ganze Zeit im VIS Editor!

      Wie kann ich die dann in dem Widet einbinden?

      Edit: Gefunden. Schalter = trashschedule.0.type.json

      ioBroker auf NUC unter Proxmox; VIS: 12" Touchscreen und 17" Touch; Lichtsteuerung, Thermometer und Sensoren: Tasmota (39); Ambiente Beleuchtung: WLED (9); Heizung: DECT Thermostate (9) an Fritz 6690; EMS-ESP; 1 Echo V2; 3 Echo DOT; 1 Echo Connect; 2 Echo Show 5; Unifi Ap-Ac Lite.

      1 Reply Last reply
      1
      • haus-automatisierungH haus-automatisierung

        Ich habe in der letzten Version vom Tashschedule ein VIS Widget hinzugefügt. Das sieht aktuell so aus:

        Screenshot 2020-03-07 at 21.31.45.png

        Die Daten kommen aus dem json-Datenpunkt. Farben können jetzt direkt auf dem jeweiligen Typen hinterlegt werden.

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

        @haus-automatisierung
        hallo matthias,
        frage zum widget

        was macht eigentlich das "extra-Attr" im widget ?

        ich habe einen dunklen hintergrund - leider sieht man dann die deckel nicht mehr
        kann man da noch was machen ?

        Image 2.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

        haus-automatisierungH 1 Reply Last reply
        0
        • haus-automatisierungH haus-automatisierung

          @Chaot Hier mal ein Screenshot meiner Config

          Screenshot 2020-03-07 at 21.44.05.png

          Die Hex-Werte für die Farben suchst Du einfach mit einem beliebigen Color Picker aus. Zum Beispiel bei Google nach "Color Picker" suchen.

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

          @haus-automatisierung

          ich nochmal - hab heute "putztag" - d.h ich räume meine vis auf indem ich mir das log im browser anschaue - habe x-fehler gefunden und einer ist mir noch aufgefallen - habe ich da was falsch eingestellt

          Image 6.png

          Image 7.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 Reply Last reply
          0
          • liv-in-skyL liv-in-sky

            @haus-automatisierung
            hallo matthias,
            frage zum widget

            was macht eigentlich das "extra-Attr" im widget ?

            ich habe einen dunklen hintergrund - leider sieht man dann die deckel nicht mehr
            kann man da noch was machen ?

            Image 2.png

            haus-automatisierungH Online
            haus-automatisierungH Online
            haus-automatisierung
            Developer Most Active
            wrote on last edited by
            #157

            @liv-in-sky Eigentlich sollte die Farbe der SVGs automatisch errechnet und angepasst werden. Das ist ein bisschen Tricky gelöst und sicher noch nicht ganz stabil. Bei manchen Farben kann er daher wohl etwas durcheinander kommen. Muss ich mir anschauen.

            🧑‍🎓 Autor des beliebten ioBroker-Master-Kurses
            🎥 Tutorials rund um das Thema DIY-Smart-Home: https://haus-automatisierung.com/
            📚 Meine inoffizielle ioBroker Dokumentation

            1 Reply Last reply
            0
            • crunchipC crunchip

              @ChrisXY
              View
              View-Abfallkalender.txt
              Anzeige für die Tage
              Abfalltermine.txt
              Heute Morgen Übermorgen
              Müllwarnung.txt

              Axel KoenekeA Offline
              Axel KoenekeA Offline
              Axel Koeneke
              wrote on last edited by
              #158

              @crunchip Moin, kannst du mal bitte erklären wie du die VIS eingebunden hast?
              Die Scripte laufen und bringen die richtigen Werte, aber ich komme mit der VIS nicht weiter. Welches Widget hat du dafür genommen.
              Viele Grüße

              crunchipC 1 Reply Last reply
              0
              • SBorgS Offline
                SBorgS Offline
                SBorg
                Forum Testing Most Active
                wrote on last edited by
                #159

                Auf dunklem Hintergrung funktioniert bei mir (hier auf 50% skaliert):
                Bild 2.png
                @haus-automatisierung Hi Matthias, ev. wäre es noch vorteilhaft die Textfarbe im Adapter einstellen zu können (per CSS werden es die meisten nicht hinbekommen). Das Standard-weiß ist auf der Gelben sonst nicht wirklich lesbar :)

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

                haus-automatisierungH 1 Reply Last reply
                1
                • Axel KoenekeA Axel Koeneke

                  @crunchip Moin, kannst du mal bitte erklären wie du die VIS eingebunden hast?
                  Die Scripte laufen und bringen die richtigen Werte, aber ich komme mit der VIS nicht weiter. Welches Widget hat du dafür genommen.
                  Viele Grüße

                  crunchipC Offline
                  crunchipC Offline
                  crunchip
                  Forum Testing Most Active
                  wrote on last edited by
                  #160

                  @Axel-Koeneke weiter oben, ist doch ein export als Textdatei hinterlegt. Was klappt denn nicht?

                  umgestiegen von Proxmox auf Unraid

                  Axel KoenekeA 1 Reply Last reply
                  0
                  • SBorgS SBorg

                    Auf dunklem Hintergrung funktioniert bei mir (hier auf 50% skaliert):
                    Bild 2.png
                    @haus-automatisierung Hi Matthias, ev. wäre es noch vorteilhaft die Textfarbe im Adapter einstellen zu können (per CSS werden es die meisten nicht hinbekommen). Das Standard-weiß ist auf der Gelben sonst nicht wirklich lesbar :)

                    haus-automatisierungH Online
                    haus-automatisierungH Online
                    haus-automatisierung
                    Developer Most Active
                    wrote on last edited by haus-automatisierung
                    #161

                    @SBorg Eigentlich sollten sich alle Farben per CSS anpassen lassen. Welche genau funktionieren denn nicht?

                    Edit: Ach, nicht hinbekommen. Habe nicht übernommen gelesen. Naja aber so funktioniert doch eigentlich jedes VIS Widget, oder?

                    🧑‍🎓 Autor des beliebten ioBroker-Master-Kurses
                    🎥 Tutorials rund um das Thema DIY-Smart-Home: https://haus-automatisierung.com/
                    📚 Meine inoffizielle ioBroker Dokumentation

                    SBorgS 1 Reply Last reply
                    1
                    • haus-automatisierungH haus-automatisierung

                      @SBorg Eigentlich sollten sich alle Farben per CSS anpassen lassen. Welche genau funktionieren denn nicht?

                      Edit: Ach, nicht hinbekommen. Habe nicht übernommen gelesen. Naja aber so funktioniert doch eigentlich jedes VIS Widget, oder?

                      SBorgS Offline
                      SBorgS Offline
                      SBorg
                      Forum Testing Most Active
                      wrote on last edited by SBorg
                      #162

                      @haus-automatisierung Sorry, ich war blind. Ab und zu hängt der VIS-Editor und zeigt nicht immer alles gleich an. Eben erst gesehen, dass es in der VIS dann funktioniert (+ spätestens auch im Editor wenn man notfalls mal die ganze Seite aktualisiert). Du hast natürlich Recht, geht ganz easy per CSS-Textfarbe und auch (meistens) dann direkt im Editor ;)

                      *EDIT* aber ein Problem bleibt: setzte ich die Farbe pauschal dunkler ändert sich die gesamte Textfarbe des Widgets. Dann lässt sich der restliche Text nicht mehr lesen "schwarzer Adler auf schwarzem Grund". Also doch händisch per CSS eingreifen...

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

                      1 Reply Last reply
                      1
                      • crunchipC crunchip

                        @Axel-Koeneke weiter oben, ist doch ein export als Textdatei hinterlegt. Was klappt denn nicht?

                        Axel KoenekeA Offline
                        Axel KoenekeA Offline
                        Axel Koeneke
                        wrote on last edited by
                        #163

                        @crunchip Du meinst wohl den hier: @crunchip sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                        @ChrisXY
                        View
                        View-Abfallkalender.txt
                        Anzeige für die Tage
                        Abfalltermine.txt
                        Heute Morgen Übermorgen
                        Müllwarnung.txt

                        Ich bin noch neu beim beim Broker und komme von Openhab...
                        Ich habe keine Ahnung wo ich in der VIS die Datei "View-Abfallkalender" hintun soll...

                        Was mir aufgefallen ist, ist das in der Datei auch lokale Zugriffe sind. Flot auf der Adresse 192.168.2.2 - Soll das so sein?
                        VG

                        sigi234S crunchipC 2 Replies Last reply
                        0
                        • Axel KoenekeA Axel Koeneke

                          @crunchip Du meinst wohl den hier: @crunchip sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                          @ChrisXY
                          View
                          View-Abfallkalender.txt
                          Anzeige für die Tage
                          Abfalltermine.txt
                          Heute Morgen Übermorgen
                          Müllwarnung.txt

                          Ich bin noch neu beim beim Broker und komme von Openhab...
                          Ich habe keine Ahnung wo ich in der VIS die Datei "View-Abfallkalender" hintun soll...

                          Was mir aufgefallen ist, ist das in der Datei auch lokale Zugriffe sind. Flot auf der Adresse 192.168.2.2 - Soll das so sein?
                          VG

                          sigi234S Online
                          sigi234S Online
                          sigi234
                          Forum Testing Most Active
                          wrote on last edited by
                          #164

                          @Axel-Koeneke sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                          Ich habe keine Ahnung wo ich in der VIS die Datei "View-Abfallkalender" hintun soll...

                          Als VIEW importieren!

                          Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                          Immer Daten sichern!

                          1 Reply Last reply
                          0
                          • SBorgS Offline
                            SBorgS Offline
                            SBorg
                            Forum Testing Most Active
                            wrote on last edited by SBorg
                            #165

                            "Eingriff" direkt per CSS (nur daysleft gefärbt):
                            Bild 4.png

                            vs Widget CSS-Textfarbe "black":

                            Bild 4.png

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

                            NegaleinN 1 Reply Last reply
                            1
                            • Axel KoenekeA Axel Koeneke

                              @crunchip Du meinst wohl den hier: @crunchip sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                              @ChrisXY
                              View
                              View-Abfallkalender.txt
                              Anzeige für die Tage
                              Abfalltermine.txt
                              Heute Morgen Übermorgen
                              Müllwarnung.txt

                              Ich bin noch neu beim beim Broker und komme von Openhab...
                              Ich habe keine Ahnung wo ich in der VIS die Datei "View-Abfallkalender" hintun soll...

                              Was mir aufgefallen ist, ist das in der Datei auch lokale Zugriffe sind. Flot auf der Adresse 192.168.2.2 - Soll das so sein?
                              VG

                              crunchipC Offline
                              crunchipC Offline
                              crunchip
                              Forum Testing Most Active
                              wrote on last edited by
                              #166

                              @Axel-Koeneke hast du es hinbekommen? wie sigi234 schon schrieb, als view importieren.

                              was meinst du mit Flot....Adresse??

                              umgestiegen von Proxmox auf Unraid

                              Axel KoenekeA 1 Reply Last reply
                              0
                              • SBorgS SBorg

                                "Eingriff" direkt per CSS (nur daysleft gefärbt):
                                Bild 4.png

                                vs Widget CSS-Textfarbe "black":

                                Bild 4.png

                                NegaleinN Offline
                                NegaleinN Offline
                                Negalein
                                Global Moderator
                                wrote on last edited by Negalein
                                #167

                                @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                "Eingriff" direkt per CSS (nur daysleft gefärbt):

                                welchen CSS hast du da verwendet?

                                (hier auf 50% skaliert)

                                wie machst du das?
                                Wenn ich width und height angebe, bleiben die Tonnen gleich groß und verschieben sich nur.

                                Edit vis.png Edit vis (1).png

                                @haus-automatisierung
                                wie ist das mit dem offenen, bzw. geschlossenen Deckel zu verstehen?
                                Edit vis (2).png

                                ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                                ° Node.js Fixer ---> iob nodejs-update
                                ° Fixer ---> iob fix

                                SBorgS 1 Reply Last reply
                                0
                                • NegaleinN Negalein

                                  @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                  "Eingriff" direkt per CSS (nur daysleft gefärbt):

                                  welchen CSS hast du da verwendet?

                                  (hier auf 50% skaliert)

                                  wie machst du das?
                                  Wenn ich width und height angebe, bleiben die Tonnen gleich groß und verschieben sich nur.

                                  Edit vis.png Edit vis (1).png

                                  @haus-automatisierung
                                  wie ist das mit dem offenen, bzw. geschlossenen Deckel zu verstehen?
                                  Edit vis (2).png

                                  SBorgS Offline
                                  SBorgS Offline
                                  SBorg
                                  Forum Testing Most Active
                                  wrote on last edited by
                                  #168

                                  @Negalein Ich habe mir das CSS vom Widget angeschaut und dann überschreibe ich die entsprechenden Werte. Einfach den eigenen Farbwünschen anpassen und bei CSS hinzufügen (am besten bei "Projekt"):

                                  .trashtype .daysleft {
                                      background: #CCCCCC88 !important;
                                      color: #222222 !important;
                                  }
                                  

                                  Nun ist der Hintergrund etwas stärker und die Schrift fast schwarz. Trotzdem kann man noch im Widget die Textfarbe ändern:
                                  Bild 1.png

                                  Die Skalierung habe ich einfach über "transform" (in CSS Allgemein) realisiert. Einfach für bspw. die 50% eintragen:

                                  scale(0.5)
                                  

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

                                  NegaleinN ChaotC 2 Replies Last reply
                                  0
                                  • SBorgS SBorg

                                    @Negalein Ich habe mir das CSS vom Widget angeschaut und dann überschreibe ich die entsprechenden Werte. Einfach den eigenen Farbwünschen anpassen und bei CSS hinzufügen (am besten bei "Projekt"):

                                    .trashtype .daysleft {
                                        background: #CCCCCC88 !important;
                                        color: #222222 !important;
                                    }
                                    

                                    Nun ist der Hintergrund etwas stärker und die Schrift fast schwarz. Trotzdem kann man noch im Widget die Textfarbe ändern:
                                    Bild 1.png

                                    Die Skalierung habe ich einfach über "transform" (in CSS Allgemein) realisiert. Einfach für bspw. die 50% eintragen:

                                    scale(0.5)
                                    
                                    NegaleinN Offline
                                    NegaleinN Offline
                                    Negalein
                                    Global Moderator
                                    wrote on last edited by
                                    #169

                                    @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                    Einfach den eigenen Farbwünschen anpassen und bei CSS hinzufügen (am besten bei "Projekt"):

                                    Danke
                                    Wie kommst du an das CSS vom Widget? Über die Console im Browser?

                                    scale(0.5)

                                    Ich Depp. Klar mit scale. Und ich habs mit calc probiert. :astonished:

                                    ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                                    ° Node.js Fixer ---> iob nodejs-update
                                    ° Fixer ---> iob fix

                                    SBorgS 1 Reply Last reply
                                    0
                                    • NegaleinN Negalein

                                      @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                      Einfach den eigenen Farbwünschen anpassen und bei CSS hinzufügen (am besten bei "Projekt"):

                                      Danke
                                      Wie kommst du an das CSS vom Widget? Über die Console im Browser?

                                      scale(0.5)

                                      Ich Depp. Klar mit scale. Und ich habs mit calc probiert. :astonished:

                                      SBorgS Offline
                                      SBorgS Offline
                                      SBorg
                                      Forum Testing Most Active
                                      wrote on last edited by
                                      #170

                                      @Negalein sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                      Wie kommst du an das CSS vom Widget? Über die Console im Browser?

                                      Ne, direkt auf Verzeichnisebene. Da ist das IMO einfacher:

                                      /opt/iobroker/node_modules/iobroker.vis/www/widgets/trashschedule/css/style.css
                                      

                                      Das "!important" gibt es dort allerdings nicht. Damit wird immer der entsprechende Wert des Originals überschrieben.

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

                                      NegaleinN 1 Reply Last reply
                                      0
                                      • SBorgS SBorg

                                        @Negalein sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                        Wie kommst du an das CSS vom Widget? Über die Console im Browser?

                                        Ne, direkt auf Verzeichnisebene. Da ist das IMO einfacher:

                                        /opt/iobroker/node_modules/iobroker.vis/www/widgets/trashschedule/css/style.css
                                        

                                        Das "!important" gibt es dort allerdings nicht. Damit wird immer der entsprechende Wert des Originals überschrieben.

                                        NegaleinN Offline
                                        NegaleinN Offline
                                        Negalein
                                        Global Moderator
                                        wrote on last edited by
                                        #171

                                        @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                        Ne, direkt auf Verzeichnisebene. Da ist das IMO einfacher:

                                        werd ich mir merken.

                                        Warum sieht man bei deinem Widget ein Kreuz im Deckel und bei mir nicht?
                                        Edit vis (3).png

                                        ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                                        ° Node.js Fixer ---> iob nodejs-update
                                        ° Fixer ---> iob fix

                                        SBorgS 1 Reply Last reply
                                        0
                                        • NegaleinN Negalein

                                          @SBorg sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                          Ne, direkt auf Verzeichnisebene. Da ist das IMO einfacher:

                                          werd ich mir merken.

                                          Warum sieht man bei deinem Widget ein Kreuz im Deckel und bei mir nicht?
                                          Edit vis (3).png

                                          SBorgS Offline
                                          SBorgS Offline
                                          SBorg
                                          Forum Testing Most Active
                                          wrote on last edited by SBorg
                                          #172

                                          @Negalein Gute Frage, nächste Frage... ;)
                                          Hast du Hexwerte bei den Farben genommen, oder einfach red, black, yellow? Ev. klappt dann die Umrechnung nicht?

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

                                          NegaleinN 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

                                          341

                                          Online

                                          32.7k

                                          Users

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