Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. neue Visualisierung "webui" (alternative zu vis & vis-2)

    NEWS

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

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

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

      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

      jogibear9988 1 Reply Last reply Reply Quote 1
      • jogibear9988
        jogibear9988 @Blockmove last edited by 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 1 Reply Last reply Reply Quote 0
        • B
          Blockmove @jogibear9988 last edited by

          @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 😀

          1 Reply Last reply Reply Quote 0
          • jogibear9988
            jogibear9988 last edited by

            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)

            1 Reply Last reply Reply Quote 1
            • jogibear9988
              jogibear9988 last edited by

              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 1 Reply Last reply Reply Quote 1
              • B
                Blockmove @jogibear9988 last edited by

                @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!

                1 Reply Last reply Reply Quote 0
                • B
                  Blockmove last edited by

                  @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

                  jogibear9988 1 Reply Last reply Reply Quote 0
                  • jogibear9988
                    jogibear9988 @Blockmove last edited by

                    @blockmove
                    sollte gefixt sein

                    B 1 Reply Last reply Reply Quote 1
                    • jogibear9988
                      jogibear9988 last edited by

                      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.

                      jogibear9988 1 Reply Last reply Reply Quote 0
                      • jogibear9988
                        jogibear9988 @jogibear9988 last edited by

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

                        1 Reply Last reply Reply Quote 0
                        • jogibear9988
                          jogibear9988 last edited by

                          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

                          1 Reply Last reply Reply Quote 1
                          • B
                            Blockmove @jogibear9988 last edited by

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

                            @blockmove
                            sollte gefixt sein

                            Funktioniert ... Vielen Dank!

                            1 Reply Last reply Reply Quote 0
                            • B
                              Blockmove last edited by

                              @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

                              jogibear9988 1 Reply Last reply Reply Quote 0
                              • jogibear9988
                                jogibear9988 @Blockmove last edited by 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 1 Reply Last reply Reply Quote 0
                                • B
                                  Blockmove @jogibear9988 last edited by

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

                                  jogibear9988 1 Reply Last reply Reply Quote 0
                                  • jogibear9988
                                    jogibear9988 @Blockmove last edited by

                                    @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 1 Reply Last reply Reply Quote 0
                                    • B
                                      Blockmove @jogibear9988 last edited by

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

                                      jogibear9988 1 Reply Last reply Reply Quote 0
                                      • jogibear9988
                                        jogibear9988 @Blockmove last edited by

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

                                        B 1 Reply Last reply Reply Quote 0
                                        • B
                                          Blockmove @jogibear9988 last edited by

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

                                          1 Reply Last reply Reply Quote 0
                                          • jogibear9988
                                            jogibear9988 last edited by

                                            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.

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            974
                                            Online

                                            31.7k
                                            Users

                                            79.7k
                                            Topics

                                            1.3m
                                            Posts

                                            20
                                            1074
                                            276723
                                            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