Skip to content
  • 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
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. neue Visualisierung "webui" (alternative zu vis & vis-2)

NEWS

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

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.8k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.1k

neue Visualisierung "webui" (alternative zu vis & vis-2)

Scheduled Pinned Locked Moved Visualisierung
1.1k Posts 21 Posters 347.8k Views 18 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.
  • B Blockmove

    Hier mal mein erstes "vorzeigbares" CustomControl

    CustomC0ntrol1.png
    pdRaumHzgChart.control

    Ich hab für jeden Raum ein echart mit Kurven für Soll-, Isttemperatur und Ventilstellung.
    Über dem Chart wollte ich einfach die aktuellen Werte angezeigt bekommen.

    EChart und Werte werden einfach als Property übergeben

    CustomControl2.png

    Hat man sich mal etwas reingefuchst, dann ist man mit webui extrem flexibel

    jogibear9988J Offline
    jogibear9988J Offline
    jogibear9988
    wrote on last edited by jogibear9988
    #99

    @blockmove

    Ich hab auch meine chart webcomponente mal in ein custom control gewrappt:
    2e46942e-3109-4c2d-ade8-2199f4e67907-image.png

    beispiel ist auf dem demo server. Dafür musst du für die signale nicht extra ein echart anlegen, kann aber auch lange nicht so viel

    Check my ioBroker webui - a vis alternative
    see: https://github.com/iobroker-community-adapters/ioBroker.webui

    B 1 Reply Last reply
    0
    • jogibear9988J jogibear9988

      @blockmove

      Ich hab auch meine chart webcomponente mal in ein custom control gewrappt:
      2e46942e-3109-4c2d-ade8-2199f4e67907-image.png

      beispiel ist auf dem demo server. Dafür musst du für die signale nicht extra ein echart anlegen, kann aber auch lange nicht so viel

      B Offline
      B Offline
      Blockmove
      wrote on last edited by
      #100

      @jogibear9988 said in neue Visualiserung "webui" im stable repository:

      @blockmove

      Ich hab auch meine chart webcomponente mal in ein custom control gewrappt:
      2e46942e-3109-4c2d-ade8-2199f4e67907-image.png

      beispiel ist auf dem demo server. Dafür musst du für die signale nicht extra ein echart anlegen, kann aber auch lange nicht so viel

      Hab mir gerade dein Beispiel angeschaut.
      Dafür findet sich bestimmt ne Verwendung. So ne Art Kachel wie bei iQontrol Visu.
      Die echart hatte ich schon fertig.
      So langsam beginnt der Umzug von vis zu webui.
      Bis jetzt läuft es entspannter als meine Versuche mit der vis-2 😀

      The difference beetween Man and Boys:
      The price of their toys 😀

      1 Reply Last reply
      0
      • jogibear9988J Offline
        jogibear9988J Offline
        jogibear9988
        wrote on last edited by
        #101

        Hab eine neue Komponente gefunden welche man im designer nutzen kann:
        https://github.com/smontanus/dial-gauge

        ae7bc989-439e-4a36-85ab-9d93160ae496-image.png

        Beispiel gibts hier: http://129.159.205.3:8082/webui/index.html (im screen chart)

        Check my ioBroker webui - a vis alternative
        see: https://github.com/iobroker-community-adapters/ioBroker.webui

        1 Reply Last reply
        1
        • jogibear9988J Offline
          jogibear9988J Offline
          jogibear9988
          wrote on last edited by
          #102

          Neue UI für das Refactoring von Signalen.
          Damit kann man Signale in Scripts&Bindings auf einmal ändern wenn sie mehrmals verwendet sind.

          9f15a9e3-a273-4a05-8cea-434dc02187ff-image.png

          Check my ioBroker webui - a vis alternative
          see: https://github.com/iobroker-community-adapters/ioBroker.webui

          B 1 Reply Last reply
          1
          • jogibear9988J jogibear9988

            Neue UI für das Refactoring von Signalen.
            Damit kann man Signale in Scripts&Bindings auf einmal ändern wenn sie mehrmals verwendet sind.

            9f15a9e3-a273-4a05-8cea-434dc02187ff-image.png

            B Offline
            B Offline
            Blockmove
            wrote on last edited by
            #103

            @jogibear9988 said in neue Visualiserung "webui" im stable repository:

            Neue UI für das Refactoring von Signalen.
            Damit kann man Signale in Scripts&Bindings auf einmal ändern wenn sie mehrmals verwendet sind.

            Hab gerade die neue Version installiert. Schöne Sache mit dem Refactoring!

            The difference beetween Man and Boys:
            The price of their toys 😀

            1 Reply Last reply
            0
            • B Offline
              B Offline
              Blockmove
              wrote on last edited by
              #104

              @jogibear9988

              Hallo Jochen,
              mir ist ne Kleinigkeit aufgefallen:
              Wenn ich in der ioBroker Übersicht auf webui klicke, dann lande ich nicht auf der Runtime, sondern auch im Editor.

              Uebersicht.png

              Schönes Sonntag

              VG
              Dieter

              The difference beetween Man and Boys:
              The price of their toys 😀

              jogibear9988J 1 Reply Last reply
              0
              • B Blockmove

                @jogibear9988

                Hallo Jochen,
                mir ist ne Kleinigkeit aufgefallen:
                Wenn ich in der ioBroker Übersicht auf webui klicke, dann lande ich nicht auf der Runtime, sondern auch im Editor.

                Uebersicht.png

                Schönes Sonntag

                VG
                Dieter

                jogibear9988J Offline
                jogibear9988J Offline
                jogibear9988
                wrote on last edited by
                #105

                @blockmove
                sollte gefixt sein

                Check my ioBroker webui - a vis alternative
                see: https://github.com/iobroker-community-adapters/ioBroker.webui

                B 1 Reply Last reply
                1
                • jogibear9988J Offline
                  jogibear9988J Offline
                  jogibear9988
                  wrote on last edited by
                  #106

                  Der refactor service, kann nun auch noch für text content benutzt werden.
                  D.h. wenn ihr mehrere elemente mit dem gleichen text im content oder value selektiert, könnt ihr diesen damit auch refactorn.
                  Wenn es da noch andere sinvolle möglichkeiten gibt, einfach melden.

                  2ad460cb-aae6-4501-98d7-948b6f2e4fca-image.png

                  Achso, um das refactoring anzuwenden, einfach "Enter" in der Textbox mit dem Wert drücken den Ihr ändern wollt.

                  Check my ioBroker webui - a vis alternative
                  see: https://github.com/iobroker-community-adapters/ioBroker.webui

                  jogibear9988J 1 Reply Last reply
                  0
                  • jogibear9988J jogibear9988

                    Der refactor service, kann nun auch noch für text content benutzt werden.
                    D.h. wenn ihr mehrere elemente mit dem gleichen text im content oder value selektiert, könnt ihr diesen damit auch refactorn.
                    Wenn es da noch andere sinvolle möglichkeiten gibt, einfach melden.

                    2ad460cb-aae6-4501-98d7-948b6f2e4fca-image.png

                    Achso, um das refactoring anzuwenden, einfach "Enter" in der Textbox mit dem Wert drücken den Ihr ändern wollt.

                    jogibear9988J Offline
                    jogibear9988J Offline
                    jogibear9988
                    wrote on last edited by
                    #107

                    @jogibear9988
                    vlt würde das refactoring generell für alle attribute werte sinn machen? braucht das jemand?

                    Check my ioBroker webui - a vis alternative
                    see: https://github.com/iobroker-community-adapters/ioBroker.webui

                    1 Reply Last reply
                    0
                    • jogibear9988J Offline
                      jogibear9988J Offline
                      jogibear9988
                      wrote on last edited by
                      #108

                      So, nun gibt es auch eine (wenn auch noch recht simple), UI für die historic bindings...

                      12a6efa8-1ea0-40f2-aa12-7a9f204e0473-image.png

                      Was ihr da einstellen könnt, am besten in den verschiedenen history adapter nachlesen:
                      https://github.com/ioBroker/ioBroker.influxdb#access-values-from-javascript-adapter

                      Check my ioBroker webui - a vis alternative
                      see: https://github.com/iobroker-community-adapters/ioBroker.webui

                      1 Reply Last reply
                      1
                      • jogibear9988J jogibear9988

                        @blockmove
                        sollte gefixt sein

                        B Offline
                        B Offline
                        Blockmove
                        wrote on last edited by
                        #109

                        @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                        @blockmove
                        sollte gefixt sein

                        Funktioniert ... Vielen Dank!

                        The difference beetween Man and Boys:
                        The price of their toys 😀

                        1 Reply Last reply
                        0
                        • B Offline
                          B Offline
                          Blockmove
                          wrote on last edited by
                          #110

                          @jogibear9988

                          Hallo Jochen,

                          mal eine Idee:
                          Als Einsteiger tu ich mich noch manchmal mit der Bedienung schwer.
                          Und zwar ganz banale Dinge wie z.B.: Bei welchem Element passiert was bei Rechtsklick.
                          Ich musste neulich nochmal deine Youtube-Videos anschauen, weil ich nicht gefunden hab, wo ich Javascript erstellen kann. Wäre es möglich solche Elemente irgendwie zu kennzeichnen (farbiger Rahmen oder Ähnliches)?

                          VG
                          Dieter

                          The difference beetween Man and Boys:
                          The price of their toys 😀

                          jogibear9988J 1 Reply Last reply
                          0
                          • B Blockmove

                            @jogibear9988

                            Hallo Jochen,

                            mal eine Idee:
                            Als Einsteiger tu ich mich noch manchmal mit der Bedienung schwer.
                            Und zwar ganz banale Dinge wie z.B.: Bei welchem Element passiert was bei Rechtsklick.
                            Ich musste neulich nochmal deine Youtube-Videos anschauen, weil ich nicht gefunden hab, wo ich Javascript erstellen kann. Wäre es möglich solche Elemente irgendwie zu kennzeichnen (farbiger Rahmen oder Ähnliches)?

                            VG
                            Dieter

                            jogibear9988J Offline
                            jogibear9988J Offline
                            jogibear9988
                            wrote on last edited by jogibear9988
                            #111

                            @blockmove
                            möglich ist alles, nur was ist intuitiv. Ich kann es meist schwer nachvollziehen, da ich das ganze entworfen habe, und mir es einfach klar ist.

                            Farbiger rahmen würde mir jetzt nicht wirklich gefallen, wie sähe das z.b., dann im script editor aus?
                            Und ist das intuitiv?

                            Vlt. ist das ganze rechtsklick zeugs auch nicht wirklich gut und man sollte es anders lösen?

                            Wo hab ich den rechtsklicks?

                            • projekt explorer -> dort finde ich passt es, ist ja auch in visualstudio so
                            • event button -> unintuitiv, buttons haben eig. kein rechtsklick, gute idee dazu?
                            • script editor, script element -> fraglich... gute idee dazu?
                            • script editor, property grid -> ebenso fraglich, gute idee dazu?
                            • designer -> finde ich dort schon intuitiv
                            • designer, propertygrid auf das kleine rechteck -> intuitiv?? kein plan, ideen?

                            mehr rechtsklicks gibts glaube nicht...

                            Check my ioBroker webui - a vis alternative
                            see: https://github.com/iobroker-community-adapters/ioBroker.webui

                            B 1 Reply Last reply
                            0
                            • jogibear9988J jogibear9988

                              @blockmove
                              möglich ist alles, nur was ist intuitiv. Ich kann es meist schwer nachvollziehen, da ich das ganze entworfen habe, und mir es einfach klar ist.

                              Farbiger rahmen würde mir jetzt nicht wirklich gefallen, wie sähe das z.b., dann im script editor aus?
                              Und ist das intuitiv?

                              Vlt. ist das ganze rechtsklick zeugs auch nicht wirklich gut und man sollte es anders lösen?

                              Wo hab ich den rechtsklicks?

                              • projekt explorer -> dort finde ich passt es, ist ja auch in visualstudio so
                              • event button -> unintuitiv, buttons haben eig. kein rechtsklick, gute idee dazu?
                              • script editor, script element -> fraglich... gute idee dazu?
                              • script editor, property grid -> ebenso fraglich, gute idee dazu?
                              • designer -> finde ich dort schon intuitiv
                              • designer, propertygrid auf das kleine rechteck -> intuitiv?? kein plan, ideen?

                              mehr rechtsklicks gibts glaube nicht...

                              B Offline
                              B Offline
                              Blockmove
                              wrote on last edited by
                              #112

                              @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                              @blockmove
                              möglich ist alles, nur was ist intuitiv. Ich kann es meist schwer nachvollziehen, da ich das ganze entworfen habe, und mir es einfach klar ist.

                              Farbiger rahmen würde mir jetzt nicht wirklich gefallen, wie sähe das z.b., dann im script editor aus?
                              Und ist das intuitiv?

                              Vlt. ist das ganze rechtsklick zeugs auch nicht wirklich gut und man sollte es anders lösen?

                              Wo hab ich den rechtsklicks?

                              • projekt explorer -> dort finde ich passt es, ist ja auch in visualstudio so
                              • event button -> unintuitiv, buttons haben eig. kein rechtsklick, gute idee dazu?
                              • script editor, script element -> fraglich... gute idee dazu?
                              • script editor, property grid -> ebenso fraglich, gute idee dazu?
                              • designer -> finde ich dort schon intuitiv
                              • designer, propertygrid auf das kleine rechteck -> intuitiv?? kein plan, ideen?

                              mehr rechtsklicks gibts glaube nicht...

                              event button: Du hast dort ja auch noch die Funktion javascript.
                              Event.png

                              Vielleicht könnte man da auch das Add JS-Handler unterbringen.

                              Im Zweifelsfall lieber nen extra Button hinzufügen. Die meisten haben doch mittlerweile sowieso mind. Full-HD.

                              The difference beetween Man and Boys:
                              The price of their toys 😀

                              jogibear9988J 1 Reply Last reply
                              0
                              • B Blockmove

                                @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                                @blockmove
                                möglich ist alles, nur was ist intuitiv. Ich kann es meist schwer nachvollziehen, da ich das ganze entworfen habe, und mir es einfach klar ist.

                                Farbiger rahmen würde mir jetzt nicht wirklich gefallen, wie sähe das z.b., dann im script editor aus?
                                Und ist das intuitiv?

                                Vlt. ist das ganze rechtsklick zeugs auch nicht wirklich gut und man sollte es anders lösen?

                                Wo hab ich den rechtsklicks?

                                • projekt explorer -> dort finde ich passt es, ist ja auch in visualstudio so
                                • event button -> unintuitiv, buttons haben eig. kein rechtsklick, gute idee dazu?
                                • script editor, script element -> fraglich... gute idee dazu?
                                • script editor, property grid -> ebenso fraglich, gute idee dazu?
                                • designer -> finde ich dort schon intuitiv
                                • designer, propertygrid auf das kleine rechteck -> intuitiv?? kein plan, ideen?

                                mehr rechtsklicks gibts glaube nicht...

                                event button: Du hast dort ja auch noch die Funktion javascript.
                                Event.png

                                Vielleicht könnte man da auch das Add JS-Handler unterbringen.

                                Im Zweifelsfall lieber nen extra Button hinzufügen. Die meisten haben doch mittlerweile sowieso mind. Full-HD.

                                jogibear9988J Offline
                                jogibear9988J Offline
                                jogibear9988
                                wrote on last edited by
                                #113

                                @blockmove
                                ja die funktion javascript hatte ich bevor man ganzen javascript ranhängen konnte. Bin nicht sicher ob man die noch braucht...

                                Denke auch, extra buttons machen mehr sinn. Oder der button click öffnet das menü ob man ein simples script oder javascript möchte.

                                Check my ioBroker webui - a vis alternative
                                see: https://github.com/iobroker-community-adapters/ioBroker.webui

                                B 1 Reply Last reply
                                0
                                • jogibear9988J jogibear9988

                                  @blockmove
                                  ja die funktion javascript hatte ich bevor man ganzen javascript ranhängen konnte. Bin nicht sicher ob man die noch braucht...

                                  Denke auch, extra buttons machen mehr sinn. Oder der button click öffnet das menü ob man ein simples script oder javascript möchte.

                                  B Offline
                                  B Offline
                                  Blockmove
                                  wrote on last edited by
                                  #114

                                  @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                                  @blockmove

                                  Oder der button click öffnet das menü ob man ein simples script oder javascript möchte.

                                  Die Idee finde ich gut. Ist ja ähnlich wie bei ioBroker Script. Da kommt auch die Abfrage welche Art (Javascript, Truescript, Blockly).

                                  Die Javascript-Integration ist übrigends echt eine klasse Sache in webui. Validierung von Eingaben und all solche Dinge machen wirklich vieles einfacher.

                                  The difference beetween Man and Boys:
                                  The price of their toys 😀

                                  jogibear9988J 1 Reply Last reply
                                  0
                                  • B Blockmove

                                    @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                                    @blockmove

                                    Oder der button click öffnet das menü ob man ein simples script oder javascript möchte.

                                    Die Idee finde ich gut. Ist ja ähnlich wie bei ioBroker Script. Da kommt auch die Abfrage welche Art (Javascript, Truescript, Blockly).

                                    Die Javascript-Integration ist übrigends echt eine klasse Sache in webui. Validierung von Eingaben und all solche Dinge machen wirklich vieles einfacher.

                                    jogibear9988J Offline
                                    jogibear9988J Offline
                                    jogibear9988
                                    wrote on last edited by
                                    #115

                                    @blockmove
                                    mein ziel war eigentlich, das man das meiste mit der integrierten scriptsprache erledigen kann 😉

                                    Check my ioBroker webui - a vis alternative
                                    see: https://github.com/iobroker-community-adapters/ioBroker.webui

                                    B 1 Reply Last reply
                                    0
                                    • jogibear9988J jogibear9988

                                      @blockmove
                                      mein ziel war eigentlich, das man das meiste mit der integrierten scriptsprache erledigen kann 😉

                                      B Offline
                                      B Offline
                                      Blockmove
                                      wrote on last edited by
                                      #116

                                      @jogibear9988 said in neue Visualiserung "webui" im stable repository:

                                      @blockmove
                                      mein ziel war eigentlich, das man das meiste mit der integrierten scriptsprache erledigen kann 😉

                                      Naja für jede Aufgabe das geeignete Werkzeug 😀
                                      Ist auch nicht anders als bei Blockly und JavaScript.

                                      The difference beetween Man and Boys:
                                      The price of their toys 😀

                                      1 Reply Last reply
                                      0
                                      • jogibear9988J Offline
                                        jogibear9988J Offline
                                        jogibear9988
                                        wrote on last edited by
                                        #117

                                        hab mal wieder einen pull request für das aktuelle release auf die repository liste gemacht. d.h. in den nächsten tagen sollte die jetzige version auch im stable zweig verfügbar sein.

                                        Check my ioBroker webui - a vis alternative
                                        see: https://github.com/iobroker-community-adapters/ioBroker.webui

                                        1 Reply Last reply
                                        1
                                        • jogibear9988J jogibear9988

                                          Helfen die Videos weiter?

                                          W Offline
                                          W Offline
                                          Worlik
                                          wrote on last edited by
                                          #118

                                          @jogibear9988 Ja, absolut cool was du da geschaffen hast. Unheimlich mächtig. Ich habe händeringend nach einer Alternative für vis/vis2 gesucht. Deine webui kann so vieles besser. Das macht richtig Spaß damit etwas zu entwerfen. Ich liebe die CustomControls welche man sich zusammen bauen kann. Bitte unbedingt weiter machen. 🙂

                                          sigi234S B 2 Replies Last reply
                                          1
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          558

                                          Online

                                          32.4k

                                          Users

                                          81.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe