Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. Einfach mal zeigen will….. :-) - Teil 3

    NEWS

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    • Save The Date: ioBroker@Smart Living Forum Solingen, 14.06.

    Einfach mal zeigen will….. :-) - Teil 3

    This topic has been deleted. Only users with topic management privileges can see it.
    • F
      Fichte last edited by

      Ich habe auch einbisschen Gespielt und alles Relativ Simpel gehalten und das nötigste auf einem Blick Gebracht.
      Das ganze ist für ein Ipad Air und VIS App was im Flur hängt.
      Ich hab mal aus allem etwas gemacht

      "Home"
      ded60c06-67d1-4a90-9ecd-2a13a0610efc-image.png

      "Heizung"
      a59611c7-c493-4128-8cd3-01754e170a61-image.png

      "Heizungs Einstellungen"
      b79347cb-9fe0-4344-afd5-df8075b35332-image.png

      "Licht"
      16a84b89-af31-4c82-993d-ca6f521d4845-image.png

      M 1 Reply Last reply Reply Quote 1
      • M
        manner666 @Fichte last edited by

        @fichte Hey, mir gefällt dein Dashboard ganz gut und die Seite mit den Heizungseinstellungen.
        Würdest du dieses mal zur Verfügung stellen. Ich bin mit meiner Visu momentan gar nicht zufrieden, weil dort alles so durcheinandergewürfelt ist.

        F 1 Reply Last reply Reply Quote 0
        • F
          Fichte @manner666 last edited by

          @manner666 Der Menüpunkt Dev. und Info sind noch nicht Fertig. Habs hier hoch geladen.

          337a675e-9f09-4e70-a085-e15da6252a21-2023-02-20-ipadAir.zip

          1 Reply Last reply Reply Quote 1
          • S
            syber @Enrico Fischer last edited by

            @enrico-fischer
            Moin 😊
            könntest du dein Projekt veröffentlichen.
            Ich finde das Design Hammer👍

            Grüsse

            1 Reply Last reply Reply Quote 0
            • S
              Spampunk last edited by Spampunk

              Nachdem ich 3(!) Jahre Anlauf dafür genommen habe, habe ich nun endlich das Hydraulikschema unserer Heizung fertiggestellt. Ich habe hierzu mit InkScape ein SVG erstellt und dieses mit CSS und JavaScript animiert. Alle Datenpunkte sind mit eigebettet, so dass es auf verschiedenen Endgeräten nach Belieben skaliert werden kann.

              Die Pumpen drehen sich in Abhängigkeit zur Modulation, gleichzeitig werden die Striche animiert. Die Leitungsfarben werden in Abhängigkeit der jeweiligen Temperaturen eingestellt.

              Therme, Ofen und Wämepufferspeicher habe ich selbst selbst hergestellt. Es gibt zwar einige Vorlagen im WWW, die sind aber keine schöne Vektorgrafiken 🙂 Und der Kamin sieht so aus wie das Original 🙂

              Mein Dank geht an @Marc_St , @SBorg , @Stefan-G und viele andere, die mir auf der Reise und dem Weg hierhin geholfen haben.

              Screenshot 2023-04-01 202400.png

              Hier ein Video:
              vis.webm

              Das ist ein schönes Projekt und wahrscheinlich nie ganz fertig, aber die größte Hürde ist genommen!

              M 1 Reply Last reply Reply Quote 8
              • M
                MarkusL @Spampunk last edited by

                @spampunk Hallo Spampunk, Deine animierte Darstellung der Heizung finde ich ziemlich genial. Würdest Du sie zur Verfügung stellen, vielleicht sogar mit einigen Erklärungen, was man wo anpacken muss, um es auf eigene Bedürfnisse anzupassen?
                Das wäre echt super.
                Danke!
                VG

                S 1 Reply Last reply Reply Quote 0
                • Frederik Buss
                  Frederik Buss last edited by

                  Hier meine Visu. Läuft auf einem einfachen Lenovo Tab am Schrank in der Küche, entsprechend ist das Design auf die Einrichtung angepasst. Besonders praktisch ist die Sonos Steuerung. Die synchronisiert die kleine Roam Box in der Küche mit dem grossen Sonos im Wohnzimmer, beides lässt sich aber auch einzeln ansteuern. Bei Fragen, fragen 🙂
                  20230410_094325.jpg
                  Screenshot_2023-04-10-09-57-25-602.jpg Screenshot_2023-04-10-10-01-31-611.jpg Screenshot_2023-04-10-10-00-34-488.jpg Screenshot_2023-04-10-10-00-23-465.jpg Screenshot_2023-04-10-10-00-05-911.jpg Screenshot_2023-04-10-09-59-50-011.jpg Screenshot_2023-04-10-09-59-38-086.jpg Screenshot_2023-04-10-09-59-25-559.jpg Screenshot_2023-04-10-09-59-06-768.jpg Screenshot_2023-04-10-09-58-51-619.jpg Screenshot_2023-04-10-09-58-38-457.jpg Screenshot_2023-04-10-09-58-29-472.jpg Screenshot_2023-04-10-09-58-00-509.jpg

                  Frederik Buss 1 Reply Last reply Reply Quote 6
                  • Frederik Buss
                    Frederik Buss @Frederik Buss last edited by

                    Noch ein paar Details/Highlights zur Automation:

                    • Grundsystem Homematic IP auf Raspi 3B, iobroker und Grafana auf Raspi 4
                    • Aktoren + Thermostate Homematic, Strommessungen Steckdosen per Shelly PM
                    • Strom und Gasverbrauch per NodeMCU (optisch)
                    • Rolladensteuerung per Sonnenstand und Wettervorhersage
                    • Ansteuerung Gastherme (15 Jahre alt) per Thermostatregelungseingang - Heizung springt nur an, wenn ein Thermostat <10% öffnet, Feiertage und Wochenenden werden im Profil automatisch berücksichtigt
                    • Ansteuerung Badlicht und Unterbaulicht Küchenschränke per Homematic Bewegungsmelder. Badlicht geht automatisch an mit 20%, oder mit 100% per Taster, jeweils automatisch aus. Küchenlicht geht automatisch aus, wenn 15 Minuten keiner in der Küche ist - ewige Tüftelei zur richtigen Einstellung, aber seit einem halben Jahr stabil
                    • Rolladenstand wird mit kleinen Symbolen angezeigt (Zu/Mittel/Auf)
                    • Symbole Fenster offen werden nur eingeblendet, wenn geöffnet
                    • Script ermittelt die Verbrauchswerte einzelner Wasch/Trocken/Spülvorgänge und könnte bei Beenden eine Nachricht absetzen, ist aber hier nicht gewünscht 😉
                    • Verbindung mit Alexa per NodeRed realisiert - Alle Geräte sind lokal eingebunden, auch die Shellys haben keinen Could Zugang, lediglich der Alexa Node Red Adapter läuft gezwungenermaßen über die Cloud
                    • Strom- und Gasverbrauchswerte werden täglich auf das restliche Jahr hochgerechnet
                    • Batterieanzeigen von Batteriebetriebenen Tastern/Sensoren werden 3 farbig angezeigt (Grün/Orange/Rot)
                    • Urlaubs- und Abwesenheitsmodi steuern Rolläden, Heizung und Alarmmeldung bei geöffneten Fenster/Türkontakten
                    • Fernzugriff geht mittels Teamviewer. Der zugehörige PC startet über ein kleines WakeOnLan Script vom iobroker aus und geht noch x Minuten wieder in den Ruhezustand. Somit ist kein VPN Zugriff nötig und trotzdem sicher.
                    • Sonos Favoriten werden dynamisch erzeugt, wenn sich diese in Sonos ändern. Ansteuerung ansonsten ähnlich wie in der App: Gerät auswählen und Favorit anklicken, entweder aus Liste oder Icon.

                    Teilweise ganz schöne Tüftelei, wenn also jemand eine ähnliche Lösung sucht, gerne anschreiben 🙂

                    W 1 Reply Last reply Reply Quote 1
                    • W
                      woupi @Frederik Buss last edited by

                      Teilweise ganz schöne Tüftelei, wenn also jemand eine ähnliche Lösung sucht, gerne anschreiben 🙂

                      Ganz schön beeindruckend, da bin ich mindestens noch 5 Jahre von entfernt.

                      Frederik Buss 1 Reply Last reply Reply Quote 0
                      • S
                        Spampunk @MarkusL last edited by

                        @markusl

                        Hallo Markus,
                        hier ist der View vom Hydraulikschema. Es besteht aus 2 Basic-HTML-Widgets. Das eine beinhaltet allein das SVG, das andere den CSS- und JavaScript-Code.

                        View.txt

                        Und hier lag für mich auch die größte Herausforderung: keine Ahnung von HTML, CSS, JavaScript und wie das zusammenhängt. Wenn es Dir ähnlich geht, W3Schools ist Dein Freund 😄

                        Als SVG-Editor funktioniert der kostenlose Inkscape hervorragend. Aber auch hier musst Du Dich erst einmal gut einarbeiten. Der XML-Editor ist dabei eine lohnenswerte Hilfe, um Klassen zu vergeben. Bitte verwende dann nur den Dateityp "Optimiertes SVG " im 'Speichern unter' Dialog. Andernfalls hast Du nachher Probleme auf die Klassen zuzugreifen und die Styles zu manipulieren.

                        Wenn Du das Prinzip erst einmal verstanden hast, bekommst Du Lust auf mehr. Das nächste Projekt ist bereits im Fokus: die farbliche Echtzeitdarstellung der Lichter im Haus. Wenn es soweit ist, poste ich wieder auf diesem Kanal.

                        Bei Fragen einfach fragen, ansonsten viel Spaß und Erfolg beim Tüfteln.

                        Grüßle,
                        Timo

                        M 1 Reply Last reply Reply Quote 0
                        • Frederik Buss
                          Frederik Buss @woupi last edited by

                          @woupi Danke 🙂 Allerdings sind das mit Sicherheit keine 5 Jahre, ich habe vor einem Jahr auch bei Null angefangen und sehr viel Hilfe von vielen Seiten bekommen. Daher freue ich mich meine Erfahrungen und Lösen von Fallstricken auch weiter zu geben und so anderen zu helfen. Letztlich ist das Meiste doch Fleißarbeit, wenn man das Prinzip erst mal verstanden hat...
                          Und das Wichtigste: Nicht davon abschrecken lassen, dass die umfangreichen Lösungen unerreichbar erscheinen. Nicht alles auf einmal, sondern eins nach dem anderen, dann wächst eine komplexe Hausautomation solide Stück für Stück. Und immer fragen, wenn eine unüberwindbare Hürde vor einem steht!

                          W 1 Reply Last reply Reply Quote 0
                          • W
                            woupi @Frederik Buss last edited by

                            @frederik-buss sagte in Einfach mal zeigen will….. 🙂 - Teil 3:

                            @woupi Danke 🙂 Allerdings sind das mit Sicherheit keine 5 Jahre, ich habe vor einem Jahr auch bei Null angefangen und sehr viel Hilfe von vielen Seiten bekommen.

                            Wow, ich bin schon 3 Jahre dran und habe mit VIS nicht mal angefangen. Gut, jetzt muss man das eventuell auch ein bisschen revidieren, Ich saniere seit dem auch mein Haus und das "ich" muss man wörtlich nehmen. Bis auf ein paar Ausnahmen, habe ich bis jetzt alles selber und alleine gemacht.

                            Daher freue ich mich meine Erfahrungen und Lösen von Fallstricken auch weiter zu geben und so anderen zu helfen. Letztlich ist das Meiste doch Fleißarbeit, wenn man das Prinzip erst mal verstanden hat...

                            Das freut mich sehr und werde bestimmt in den nächsten Tagen mal darauf zurück kommen, danke schonmal dafür.

                            Und das Wichtigste: Nicht davon abschrecken lassen, dass die umfangreichen Lösungen unerreichbar erscheinen. Nicht alles auf einmal, sondern eins nach dem anderen, dann wächst eine komplexe Hausautomation solide Stück für Stück. Und immer fragen, wenn eine unüberwindbare Hürde vor einem steht!

                            So mache ich es auch.

                            VG

                            1 Reply Last reply Reply Quote 0
                            • M
                              MarkusL @Spampunk last edited by

                              @spampunk Vielen Dank! Ich werde mich mal daran machen! Das SVG kann ich aus dem HTML Widget rausportieren und mit dem weiterarbeiten?

                              1 Reply Last reply Reply Quote 0
                              • D
                                dos1973 @Ro75 last edited by

                                @ro75 sagte in Einfach mal zeigen will….. 🙂 - Teil 3:

                                Energie.png

                                Hi,

                                Wie hast du den den Verbrauch tagesbasiert erstellt - ganz rechts unter der Uhr? Also die Balkendiagramm?

                                Ich habe ein 3EM und den Source Analztics Adapter aber der macht nur Wochenweise. Deines geht ja von (Heute) und zeigt rückwärts die letzen Tahe an?

                                Frederik Buss Ro75 2 Replies Last reply Reply Quote 0
                                • Frederik Buss
                                  Frederik Buss @dos1973 last edited by

                                  @dos1973 Ich habe den Tagesverbrauch auf 2 Arten ermittelt: Einmal über einen Bereich in Grafana:

                                  SELECT non_negative_difference(last(cumulative_sum)) * 365 FROM ( SELECT cumulative_sum(non_negative_difference(last("value"))) FROM "0_userdata.0.Stromzaehler.Verbrauch" WHERE $timeFilter GROUP BY time(1d) ) WHERE $timeFilter GROUP BY time(1d) tz('Europe/Berlin')
                                  

                                  und einmal täglich kurz nach Mitternacht (Blockly: Aktueller Zählerstand - ZählerstandBeiLetzterAblesung). Dann wird der tägliche Stromverbrauch weggeschrieben, was ich für die Jahreshochrechnung nutze, bzw. als Tageswert in Grafana ausgeben kann.

                                  D 1 Reply Last reply Reply Quote 0
                                  • D
                                    dos1973 @Frederik Buss last edited by

                                    @frederik-buss
                                    Danke dir.
                                    Die Balken kommen dann aus Grafana?

                                    Frederik Buss 1 Reply Last reply Reply Quote 0
                                    • Ro75
                                      Ro75 @dos1973 last edited by

                                      @dos1973 Das Diagramm ist Material Design. Ich summiere alle Aktoren (Fritz Dect Steckdosen) und speichere den Wert in einem DP um 23:59:50 Sekunden ab. Danach summiere ich erneut. Dann wird wieder der Wert um die genannte Zeit in den DP gespeichert. Der DP wird mit SQL.0 historisiert.

                                      Der DP wird dann über die letzten 7 Tage aus der Datenbank mit einem Skript abgefragt, ein JSON erstellt, gespeichert und dann mit dem Diagramm drgestellt.

                                      D 1 Reply Last reply Reply Quote 0
                                      • D
                                        dos1973 @Ro75 last edited by

                                        @ro75

                                        Ok, danke dir.
                                        Ich hab mir mit Blockly etwas gebaut…
                                        Nicht ganz so elegant wie Du mit json 😂

                                        Mal schauen ob die Werte um 23:59 eine Tag „zurückspringen“

                                        1 Reply Last reply Reply Quote 0
                                        • Frederik Buss
                                          Frederik Buss @dos1973 last edited by

                                          @dos1973 ja genau. Ich logge einmal am Tag den Zählerstand von Strom und Gas in einen separaten Datenpunkt für die Tageshochnung, den Rest, sprich einzelne Balken für gesamt Verbrauch sowie die einzelnen Verbraucher macht Grafana.

                                          Frederik Buss 1 Reply Last reply Reply Quote 0
                                          • Frederik Buss
                                            Frederik Buss @Frederik Buss last edited by

                                            @dos1973 Hier nochmal ein paar Beispiele aus meiner Vis zu Grafana:

                                            Übersicht auf Tagesbasis mit Strom/Gasverbrauch sowie . Die einzelnen Verbraucher addiert Grafana automatisch, wie man sieht fehlen mir ca. 20-30% um auf den Gesamtverbrauch zu kommen (weisse Linie). Hintergrund: Die Kinderzimmer und Server/FritzBox werden (noch) nicht separat erfasst. Auf der rechten Seite die Zimmertemperaturen der letzten 24 Stunden sowie Heizung mit Gasverbrauch der letzten beiden Tage:
                                            Screenshot_2023-04-15-16-31-33-936.jpg

                                            Hier der Wochenverbrauch der größten Verbraucher, aufs Jahr hochgerechnet:
                                            Screenshot_2023-04-15-16-32-53-656.jpg
                                            Da Du nach Berechnungen gefragt hast, hier beispielsweise die Datenbasis für die Balkendiagramme "Kühlschrank". Wie Du siehst werden einfach stupide die aktuellen Verbrauchswerte gespeichert, den Rest macht Grafana:
                                            Zwischenablage03.jpg

                                            Hier noch ein Beispiel zum Zusammenhang Aussentemperatur und Energieverbrauch. Die Außentemperatur rechnet Grafana als Tagesmittel, Strom und Gasverbrauch als Tagessumme, hochgerechnet aufs Jahr:
                                            Screenshot_2023-04-15-16-34-59-108.jpg

                                            D 1 Reply Last reply Reply Quote 1
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            547
                                            Online

                                            31.6k
                                            Users

                                            79.4k
                                            Topics

                                            1.3m
                                            Posts

                                            vis vis editor visualisierung visualization
                                            155
                                            813
                                            238655
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo