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. Zeigt her eure Vis2

NEWS

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    11
    1
    553

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    24
    1
    1.7k

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    9.6k

Zeigt her eure Vis2

Geplant Angeheftet Gesperrt Verschoben Visualisierung
70 Beiträge 29 Kommentatoren 14.9k Aufrufe 47 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.
  • R Offline
    R Offline
    ralalla
    schrieb am zuletzt editiert von ralalla
    #52

    Super, Danke.

    ioBroker auf Intel NUC mit Proxmox / PiVCCU auf Pi3

    1 Antwort Letzte Antwort
    0
    • FlexerF Offline
      FlexerF Offline
      Flexer
      schrieb am zuletzt editiert von Flexer
      #53

      Hallo in die Runde,

      jetzt will ich auch mal kurz meine Mini Vis vorstellen. Dieses Mal nicht so aufwendig und umfangreich. Bauzeit ca. 3 Stunden. Es sind noch mehr Views vorhanden, die poste ich aber nicht da es die Kamerabilder vom Außenbereich zeigt.

      Video als Bildschirmschoner, wird angezeigt wenn der Serverschrank geschlossen ist und der BWM im Raum aktiv ist.

      Bildschirmfoto 2025-02-06 um 15.44.13.png

      Erste Seite, wenn die Tür geöffnet wird.

      Bildschirmfoto 2025-02-06 um 15.45.32.png

      Adguard

      Bildschirmfoto 2025-02-06 um 15.47.08.png

      USV

      Bildschirmfoto 2025-02-06 um 15.48.19.png

      Netzwerk Unifi

      Hier der Serverschrank
      IMG_9480.jpeg

      Und ja mein Duty Cycle ist gerade zu hoch ;) I know ;)

      Unterm Strich ist alles besser.


      Ja, voll geil hier!

      1 Antwort Letzte Antwort
      3
      • U UlliJ

        @nashra
        bitte sehr

        energieMain.txt
        card_Leistung.txt
        cardBatterie.txt
        cardEnergieAktuell.txt
        cardEnergiefluss.txt
        cardEnergieInfo.txt
        cardPrognose.txt
        cardPV.txt
        DialogPVInfo.txt
        DialogCharts.txt

        Die PV Seite braucht noch den Slider von Inventwo.
        CSS für die Lade/Entladeanimation ins Projekt kopieren.

        .charge
        {
           background: linear-gradient(0deg, #4CAF50, #FFEB3B, #4CAF50, #FFEB3B);
           background-size: 100% 300%;
           animation: gradient-bgcharge 2s ease-in-out infinite;
           animation-direction: normal;
           height: 100vh;
        }
        .discharge
        {
           background: linear-gradient(180deg, #4CAF50, #FFEB3B, #4CAF50, #FFEB3B);
           background-size: 100% 300%;
           animation: gradient-bgcharge 2s ease-in-out infinite;
           animation-direction: reverse;
           height: 100vh;
        }
        

        Da fehlen jetzt noch scripte und wahrscheinlich noch mehr CSS für die Animationen der Svg's. Ausserdem nutze ich auch noch MDCss von Uhula, da werden Formatierungen fehlen. Probier einfach mal.

        I Offline
        I Offline
        io2345
        schrieb am zuletzt editiert von
        #54

        @ullij Wo bzw. wie werden die txt Dateien eingefügt?

        U 1 Antwort Letzte Antwort
        0
        • I io2345

          @ullij Wo bzw. wie werden die txt Dateien eingefügt?

          U Offline
          U Offline
          UlliJ
          schrieb am zuletzt editiert von
          #55

          @io2345
          im Editor "Seite importieren"

          • den Inhalt der Textdateien ins Eingabefenster kopieren

          • Namen festlegen (wie Textdatei)
            ...fertig.

          wie bereits oben geschrieben, da könnte CSS für die Animation der SVG's fehlen. Manchmal habe ich es im Widget mit drin, manchmal nicht.

          Proxmox auf iNuc, lxc für IoB, InfluxDB2, Grafana, u.a. *** Homematic & Homematic IP, Shellies, Zigbee etc

          I 1 Antwort Letzte Antwort
          0
          • U UlliJ

            @io2345
            im Editor "Seite importieren"

            • den Inhalt der Textdateien ins Eingabefenster kopieren

            • Namen festlegen (wie Textdatei)
              ...fertig.

            wie bereits oben geschrieben, da könnte CSS für die Animation der SVG's fehlen. Manchmal habe ich es im Widget mit drin, manchmal nicht.

            I Offline
            I Offline
            io2345
            schrieb am zuletzt editiert von io2345
            #56

            @ullij Prima, Danke. Das geht ja eigentlich ganz einfach.
            Ist noch ziemlich leer, wahrscheinlich das "Grundgerüst". Und man muss die einzelnen Einträge noch seinen Datenpunkten zuweisen (würd ich vermuten). Mal sehen, wie das geht. Als kompletter Anfänger ist man da schon mal ganz schön gefordert...
            Dann steht da noch: CSS für die Lade/Entladeanimation ins Projekt kopieren. Wo muss das genau hin?

            Ich glaub ich bräuchte einen Thread für simple Anfängerfragen - z.B. wie erreiche ich einen einzelnen Wert, der hinter einer Fläche liegt? Gibt es so einen Thread für vis-2?

            U 1 Antwort Letzte Antwort
            0
            • I io2345

              @ullij Prima, Danke. Das geht ja eigentlich ganz einfach.
              Ist noch ziemlich leer, wahrscheinlich das "Grundgerüst". Und man muss die einzelnen Einträge noch seinen Datenpunkten zuweisen (würd ich vermuten). Mal sehen, wie das geht. Als kompletter Anfänger ist man da schon mal ganz schön gefordert...
              Dann steht da noch: CSS für die Lade/Entladeanimation ins Projekt kopieren. Wo muss das genau hin?

              Ich glaub ich bräuchte einen Thread für simple Anfängerfragen - z.B. wie erreiche ich einen einzelnen Wert, der hinter einer Fläche liegt? Gibt es so einen Thread für vis-2?

              U Offline
              U Offline
              UlliJ
              schrieb am zuletzt editiert von
              #57

              @io2345
              mach doch einen eigenen Thread auf. Da helfe ich gerne weiter

              Proxmox auf iNuc, lxc für IoB, InfluxDB2, Grafana, u.a. *** Homematic & Homematic IP, Shellies, Zigbee etc

              P 1 Antwort Letzte Antwort
              0
              • U UlliJ

                @io2345
                mach doch einen eigenen Thread auf. Da helfe ich gerne weiter

                P Offline
                P Offline
                Peks200
                schrieb am zuletzt editiert von
                #58

                Da ich mit iQontrol langsam an die Grenzen gestoßen bin was das UI angeht habe ich mich mit VIS 2 beschäftigt und mich dort ein bisschen ausgetobt :)
                Hier seht ihr das Ergebnis und kann gerne als Inspiration genutzt werden um eine VIS optisch in Richtung "Smartphone App" aufzubauen.

                Wichtig war mir ein durchgängig einheitliches Design und alles in der VIS bedienen zu können.

                screen02.png
                screen01.png

                F I D 3 Antworten Letzte Antwort
                5
                • P Peks200

                  Da ich mit iQontrol langsam an die Grenzen gestoßen bin was das UI angeht habe ich mich mit VIS 2 beschäftigt und mich dort ein bisschen ausgetobt :)
                  Hier seht ihr das Ergebnis und kann gerne als Inspiration genutzt werden um eine VIS optisch in Richtung "Smartphone App" aufzubauen.

                  Wichtig war mir ein durchgängig einheitliches Design und alles in der VIS bedienen zu können.

                  screen02.png
                  screen01.png

                  F Offline
                  F Offline
                  fuerchtischlumpf
                  schrieb am zuletzt editiert von
                  #59

                  @peks200 richtig gut geworden, ich möchte meine VIS-2 auch wie eine App aufbauen! Hast du Responive benutzt und welche Widgets hast du für die Diagramme verwendet?

                  Gruß Fürchti

                  P 1 Antwort Letzte Antwort
                  0
                  • skvarelS Online
                    skvarelS Online
                    skvarel
                    Developer
                    schrieb am zuletzt editiert von skvarel
                    #60

                    Hier nur ein kleiner Auszug.

                    Es sind rund 30 Views mit über 1.500 Widgets ... bis auf die Uhr sind es alles inventwo Widgest und inventwo Icons.

                    Die Screenshots sind zu/an unterschiedlichen Zeiten/Tagen entstanden. Daher ist die 'Stromampel' mal rot und mal grün.

                    Startseite:
                    v000_index.JPG

                    KG:
                    Keller.JPG

                    EG:
                    EG.JPG

                    OG:
                    OG.JPG

                    inventwo Büro:
                    inventwo.JPG

                    Garten:
                    Garten.JPG

                    Heizung:
                    Heizung_1.JPG

                    Heizung_2.JPG

                    Heizung_3.JPG

                    Strom:
                    Strom.JPG

                    Fenster & Türen:
                    Fenster.JPG

                    Mähroboter:
                    Roberta.JPG

                    Katzenklappe:
                    Katzen.JPG

                    Video-Zentrale:
                    Video.JPG

                    Garten Temperaturen:
                    Garten-Temp.JPG

                    Abfallkalender:
                    Abfall.JPG

                    Netzwerk:
                    Netzwerk.JPG

                    eCar:
                    eCar.JPG

                    Customizer um die VIS in der Runtime zu designen:
                    Customizer.JPG

                    #TeamInventwo
                    • Autodarts by inventwo
                    • vis-inventwo & vis-2-widgets-inventwo
                    • vis-icontwo & vis-2-widgets-icontwo

                    C 1 Antwort Letzte Antwort
                    3
                    • skvarelS skvarel

                      Hier nur ein kleiner Auszug.

                      Es sind rund 30 Views mit über 1.500 Widgets ... bis auf die Uhr sind es alles inventwo Widgest und inventwo Icons.

                      Die Screenshots sind zu/an unterschiedlichen Zeiten/Tagen entstanden. Daher ist die 'Stromampel' mal rot und mal grün.

                      Startseite:
                      v000_index.JPG

                      KG:
                      Keller.JPG

                      EG:
                      EG.JPG

                      OG:
                      OG.JPG

                      inventwo Büro:
                      inventwo.JPG

                      Garten:
                      Garten.JPG

                      Heizung:
                      Heizung_1.JPG

                      Heizung_2.JPG

                      Heizung_3.JPG

                      Strom:
                      Strom.JPG

                      Fenster & Türen:
                      Fenster.JPG

                      Mähroboter:
                      Roberta.JPG

                      Katzenklappe:
                      Katzen.JPG

                      Video-Zentrale:
                      Video.JPG

                      Garten Temperaturen:
                      Garten-Temp.JPG

                      Abfallkalender:
                      Abfall.JPG

                      Netzwerk:
                      Netzwerk.JPG

                      eCar:
                      eCar.JPG

                      Customizer um die VIS in der Runtime zu designen:
                      Customizer.JPG

                      C Offline
                      C Offline
                      cbrocker
                      schrieb am zuletzt editiert von cbrocker
                      #61

                      @skvarel Hey Sven,
                      wirklich beeindruckend, was eure Widgets alles hergeben.

                      Kann man also tatsächlich alles (von deinen VISs) mit den paar Widgets abbilden?
                      750fdd0c-cd2a-41f4-bc60-401c64fd0107-grafik.png

                      Grüße Christoph

                      Proxmox Cluster mit ioBroker, Wireguard, HomeAssistant (Testsystem), paperlessNGX, MariaDB, PiHole, Grafana, InfluxDB, 1 x BKW 600 Wp, 2 x BKW 400 Wp, 2 x SolarFlow 800 Pro mit 11,52 kWh Akku und 3,48 kWp, OpenDTU, AhoyDTU, HmIP, Shellys, AVM LAN/WLAN

                      skvarelS 1 Antwort Letzte Antwort
                      1
                      • C cbrocker

                        @skvarel Hey Sven,
                        wirklich beeindruckend, was eure Widgets alles hergeben.

                        Kann man also tatsächlich alles (von deinen VISs) mit den paar Widgets abbilden?
                        750fdd0c-cd2a-41f4-bc60-401c64fd0107-grafik.png

                        Grüße Christoph

                        skvarelS Online
                        skvarelS Online
                        skvarel
                        Developer
                        schrieb am zuletzt editiert von skvarel
                        #62

                        @cbrocker .. ja ;)

                        99% sind mit dem Universal Widget gemacht. Der Rest sind drei/vier Tabellen und ein paar Schieberegler.

                        Das neue Universal Widget ist im Gegensatz zu VIS1 sehr mächtig geworden.

                        #TeamInventwo
                        • Autodarts by inventwo
                        • vis-inventwo & vis-2-widgets-inventwo
                        • vis-icontwo & vis-2-widgets-icontwo

                        C 1 Antwort Letzte Antwort
                        1
                        • F fuerchtischlumpf

                          @peks200 richtig gut geworden, ich möchte meine VIS-2 auch wie eine App aufbauen! Hast du Responive benutzt und welche Widgets hast du für die Diagramme verwendet?

                          Gruß Fürchti

                          P Offline
                          P Offline
                          Peks200
                          schrieb am zuletzt editiert von
                          #63

                          @fuerchtischlumpf said in Zeigt her eure Vis2:

                          Responive

                          Ja, für die Diagramme habe ich das Material Widget verwendet und mit CSS Code angepasst.
                          #wXXXX .echarts-for-react path
                          {
                          fill-opacity: 1;
                          stroke-opacity: 1;
                          }
                          #wXXXX div[aria-label]
                          {
                          opacity: 0;
                          }

                          F 1 Antwort Letzte Antwort
                          0
                          • skvarelS skvarel

                            @cbrocker .. ja ;)

                            99% sind mit dem Universal Widget gemacht. Der Rest sind drei/vier Tabellen und ein paar Schieberegler.

                            Das neue Universal Widget ist im Gegensatz zu VIS1 sehr mächtig geworden.

                            C Offline
                            C Offline
                            cbrocker
                            schrieb am zuletzt editiert von
                            #64

                            @skvarel
                            danke, das ist mal sehr vielversprechend.
                            In der VIS1 habe ich schon paar eurer Vis1-Widgets, die super funktionieren.

                            Dann werde ich mich mal so langsam an die Vis2 ranmachen.

                            Noch ne andere Frage, du hast ja einige ESP32-Cams. Was für eine Software hast
                            du da drauf geflasht?

                            Proxmox Cluster mit ioBroker, Wireguard, HomeAssistant (Testsystem), paperlessNGX, MariaDB, PiHole, Grafana, InfluxDB, 1 x BKW 600 Wp, 2 x BKW 400 Wp, 2 x SolarFlow 800 Pro mit 11,52 kWh Akku und 3,48 kWp, OpenDTU, AhoyDTU, HmIP, Shellys, AVM LAN/WLAN

                            skvarelS 1 Antwort Letzte Antwort
                            0
                            • C cbrocker

                              @skvarel
                              danke, das ist mal sehr vielversprechend.
                              In der VIS1 habe ich schon paar eurer Vis1-Widgets, die super funktionieren.

                              Dann werde ich mich mal so langsam an die Vis2 ranmachen.

                              Noch ne andere Frage, du hast ja einige ESP32-Cams. Was für eine Software hast
                              du da drauf geflasht?

                              skvarelS Online
                              skvarelS Online
                              skvarel
                              Developer
                              schrieb am zuletzt editiert von
                              #65

                              @cbrocker .. ich habe auf alles ESP32-Cam die 'Tasmota 15.0.1 (release-webcam)' drauf.

                              4 reolink, 4 ESP32-CAM und eine USB-Cam über go2rtc und dann per iFrame in der VIS

                              2ca347cd-54c5-4858-966b-3cc9f4809987-image.png

                              #TeamInventwo
                              • Autodarts by inventwo
                              • vis-inventwo & vis-2-widgets-inventwo
                              • vis-icontwo & vis-2-widgets-icontwo

                              C 1 Antwort Letzte Antwort
                              1
                              • P Peks200

                                @fuerchtischlumpf said in Zeigt her eure Vis2:

                                Responive

                                Ja, für die Diagramme habe ich das Material Widget verwendet und mit CSS Code angepasst.
                                #wXXXX .echarts-for-react path
                                {
                                fill-opacity: 1;
                                stroke-opacity: 1;
                                }
                                #wXXXX div[aria-label]
                                {
                                opacity: 0;
                                }

                                F Offline
                                F Offline
                                fuerchtischlumpf
                                schrieb am zuletzt editiert von
                                #66

                                @peks200 said in Zeigt her eure Vis2:

                                #wXXXX .echarts-for-react path
                                {
                                fill-opacity: 1;
                                stroke-opacity: 1;
                                }
                                #wXXXX div[aria-label]
                                {
                                opacity: 0;
                                }

                                Danke für den Hinweis, woher weißt du welche Codes was in den Widgets beeinflussen, das Wissen fehlt mir leider komplett!

                                1 Antwort Letzte Antwort
                                0
                                • Q Offline
                                  Q Offline
                                  quinti
                                  schrieb am zuletzt editiert von
                                  #67

                                  Hallo,
                                  ich habe mal angefangen meine Wetterstation nachzubilden.
                                  Screenshot 2025-08-25 201600.png
                                  Ziel ist die Funktionen der Wetterstation swoeit als möglich nachzubilden. Klickbar ist bisher nur der Graphbutton.
                                  Ist alles noch alpha....
                                  Es fehlt auch noch die Kompassrose für die Windrichtung.
                                  mehr Infos hier:
                                  github

                                  1 Antwort Letzte Antwort
                                  5
                                  • skvarelS skvarel

                                    @cbrocker .. ich habe auf alles ESP32-Cam die 'Tasmota 15.0.1 (release-webcam)' drauf.

                                    4 reolink, 4 ESP32-CAM und eine USB-Cam über go2rtc und dann per iFrame in der VIS

                                    2ca347cd-54c5-4858-966b-3cc9f4809987-image.png

                                    C Offline
                                    C Offline
                                    cbrocker
                                    schrieb am zuletzt editiert von
                                    #68

                                    @skvarel
                                    danke für die Tips und Anregungen.

                                    Ich habe bisher eine Vivotek und eine Instar über Synology in der VIS,
                                    möchte aber auch noch ein paar ESP32-CAMs einfügen

                                    Schöne Woche

                                    Proxmox Cluster mit ioBroker, Wireguard, HomeAssistant (Testsystem), paperlessNGX, MariaDB, PiHole, Grafana, InfluxDB, 1 x BKW 600 Wp, 2 x BKW 400 Wp, 2 x SolarFlow 800 Pro mit 11,52 kWh Akku und 3,48 kWp, OpenDTU, AhoyDTU, HmIP, Shellys, AVM LAN/WLAN

                                    1 Antwort Letzte Antwort
                                    1
                                    • P Peks200

                                      Da ich mit iQontrol langsam an die Grenzen gestoßen bin was das UI angeht habe ich mich mit VIS 2 beschäftigt und mich dort ein bisschen ausgetobt :)
                                      Hier seht ihr das Ergebnis und kann gerne als Inspiration genutzt werden um eine VIS optisch in Richtung "Smartphone App" aufzubauen.

                                      Wichtig war mir ein durchgängig einheitliches Design und alles in der VIS bedienen zu können.

                                      screen02.png
                                      screen01.png

                                      I Offline
                                      I Offline
                                      io2345
                                      schrieb am zuletzt editiert von
                                      #69

                                      @peks200 said in Zeigt her eure Vis2:

                                      ...kann gerne als Inspiration genutzt werden um eine VIS optisch in Richtung "Smartphone App" aufzubauen.

                                      Könntest du bitte beispielhaft einen Export der "Home" Seite bereitstellen? Hatte schon mal per PM gefragt, aber ist wohl untergegangen.
                                      Danke!

                                      1 Antwort Letzte Antwort
                                      0
                                      • P Peks200

                                        Da ich mit iQontrol langsam an die Grenzen gestoßen bin was das UI angeht habe ich mich mit VIS 2 beschäftigt und mich dort ein bisschen ausgetobt :)
                                        Hier seht ihr das Ergebnis und kann gerne als Inspiration genutzt werden um eine VIS optisch in Richtung "Smartphone App" aufzubauen.

                                        Wichtig war mir ein durchgängig einheitliches Design und alles in der VIS bedienen zu können.

                                        screen02.png
                                        screen01.png

                                        D Offline
                                        D Offline
                                        Dk
                                        schrieb am zuletzt editiert von
                                        #70

                                        @Peks200 Das sieht ja einfach mal mega gut aus. Würdest du einen Export der Vis, bzw von einer Seite davon, als Starthilfe teilen? :=)

                                        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

                                        892

                                        Online

                                        32.5k

                                        Benutzer

                                        81.8k

                                        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