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. neue Visualisierung "webui" (alternative zu vis & vis-2)

NEWS

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

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

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

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

Scheduled Pinned Locked Moved Visualisierung
1.1k Posts 21 Posters 351.5k Views 19 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.
  • Smilie108S Smilie108

    @jogibear9988
    Sorry so geht das leider nicht ich glaub ich muss mich jetzt doch mal mit diesem parse beschäftigen.
    Eigentlich ist es schon extrem wenn man mal ca 5 jahre nix mehr mit html usw macht wieviel man da vergisst schande
    muss ich mir morgen mal anschen für heute gute nacht bin noch nicht ganz fit aber morgen ruft die arbeit ;)

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

    @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

    @jogibear9988
    Sorry so geht das leider nicht ich glaub ich muss mich jetzt doch mal mit diesem parse beschäftigen.
    Eigentlich ist es schon extrem wenn man mal ca 5 jahre nix mehr mit html usw macht wieviel man da vergisst schande
    muss ich mir morgen mal anschen für heute gute nacht bin noch nicht ganz fit aber morgen ruft die arbeit ;)

    Zum Spielen mit JSON.parse und map nutz ich immer ein normales ioBroker-Script. Da hast du bessere Debug-Möglichkeit.
    Den Chart hab ich noch nie verwendet. Da muß ich auch mal schauen.

    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
      #519

      @jogibear9988

      Hallo Jochen,
      ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
      webui-Version 1.0.15

      VG
      Dieter

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

      jogibear9988J 1 Reply Last reply
      0
      • jogibear9988J jogibear9988

        @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

        @Blockmove
        Kann man den graph aus pvvorcast

        {
          "graphs": [
            {
              "data": [
                0.962,
                1.732,
                2.449,
                3.086,
                3.623,
                4.048,
                4.242,
                4.527,
                4.559,
                4.425,
                4.095,
                3.475,
                1.691,
                0.019,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0.031,
                0.152,
                0.28,
                0.398,
                0.476,
                0.518,
                0.522,
                0.518,
                0.507,
                0.482,
                0.441,
                0.367,
                0.257,
                0.144,
                0.05,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0.021,
                0.05,
                0.104,
                0.24
              ],
              "type": "bar",
              "legendText": "Total",
              "displayOrder": 1,
              "color": "#000000",
              "tooltip_AppendText": "kW",
              "datalabel_show": true,
              "datalabel_rotation": 270,
              "datalabel_color": "#cccccc",
              "datalabel_fontSize": 12,
              "yAxis_id": 0,
              "yAxis_position": "left",
              "yAxis_show": true,
              "yAxis_appendix": "kW",
              "yAxis_step": 1,
              "yAxis_max": 7,
              "yAxis_maximumDigits": 3
            }
          ],
          "axisLabels": [
            "14.01. 10:30",
            "14.01. 11:00",
            "14.01. 11:30",
            "14.01. 12:00",
            "14.01. 12:30",
            "14.01. 13:00",
            "14.01. 13:30",
            "14.01. 14:00",
            "14.01. 14:30",
            "14.01. 15:00",
            "14.01. 15:30",
            "14.01. 16:00",
            "14.01. 16:30",
            "14.01. 17:00",
            "14.01. 17:30",
            "14.01. 18:00",
            "14.01. 18:30",
            "14.01. 19:00",
            "14.01. 19:30",
            "14.01. 20:00",
            "14.01. 20:30",
            "14.01. 21:00",
            "14.01. 21:30",
            "15.01. 06:00",
            "15.01. 06:30",
            "15.01. 07:00",
            "15.01. 07:30",
            "15.01. 08:00",
            "15.01. 08:30",
            "15.01. 09:00",
            "15.01. 09:30",
            "15.01. 10:00",
            "15.01. 10:30",
            "15.01. 11:00",
            "15.01. 11:30",
            "15.01. 12:00",
            "15.01. 12:30",
            "15.01. 13:00",
            "15.01. 13:30",
            "15.01. 14:00",
            "15.01. 14:30",
            "15.01. 15:00",
            "15.01. 15:30",
            "15.01. 16:00",
            "15.01. 16:30",
            "15.01. 17:00",
            "15.01. 17:30",
            "15.01. 18:00",
            "15.01. 18:30",
            "15.01. 19:00",
            "15.01. 19:30",
            "15.01. 20:00",
            "15.01. 20:30",
            "15.01. 21:00",
            "15.01. 21:30",
            "16.01. 06:00",
            "16.01. 06:30",
            "16.01. 07:00",
            "16.01. 07:30",
            "16.01. 08:00",
            "16.01. 08:30",
            "16.01. 09:00",
            "16.01. 09:30",
            "16.01. 10:00",
            "16.01. 10:30"
          ]
        }
        

        Eigentlich mit stadartmitteln in eine graphische ansicht wandeln?
        muss ich da was beachten ?
        bei vis gabs dafür die vom material desinge den json-chart der das konnte. steh grad mal wieder am schlauch versuche das ganze möglichst ohne umbauten zu übernehmen ;)

        screen "chart sample"

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

        @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

        @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

        @Blockmove
        Kann man den graph aus pvvorcast

        {
          "graphs": [
            {
              "data": [
                0.962,
                1.732,
                2.449,
                3.086,
                3.623,
                4.048,
                4.242,
                4.527,
                4.559,
                4.425,
                4.095,
                3.475,
                1.691,
                0.019,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0.031,
                0.152,
                0.28,
                0.398,
                0.476,
                0.518,
                0.522,
                0.518,
                0.507,
                0.482,
                0.441,
                0.367,
                0.257,
                0.144,
                0.05,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0.021,
                0.05,
                0.104,
                0.24
              ],
              "type": "bar",
              "legendText": "Total",
              "displayOrder": 1,
              "color": "#000000",
              "tooltip_AppendText": "kW",
              "datalabel_show": true,
              "datalabel_rotation": 270,
              "datalabel_color": "#cccccc",
              "datalabel_fontSize": 12,
              "yAxis_id": 0,
              "yAxis_position": "left",
              "yAxis_show": true,
              "yAxis_appendix": "kW",
              "yAxis_step": 1,
              "yAxis_max": 7,
              "yAxis_maximumDigits": 3
            }
          ],
          "axisLabels": [
            "14.01. 10:30",
            "14.01. 11:00",
            "14.01. 11:30",
            "14.01. 12:00",
            "14.01. 12:30",
            "14.01. 13:00",
            "14.01. 13:30",
            "14.01. 14:00",
            "14.01. 14:30",
            "14.01. 15:00",
            "14.01. 15:30",
            "14.01. 16:00",
            "14.01. 16:30",
            "14.01. 17:00",
            "14.01. 17:30",
            "14.01. 18:00",
            "14.01. 18:30",
            "14.01. 19:00",
            "14.01. 19:30",
            "14.01. 20:00",
            "14.01. 20:30",
            "14.01. 21:00",
            "14.01. 21:30",
            "15.01. 06:00",
            "15.01. 06:30",
            "15.01. 07:00",
            "15.01. 07:30",
            "15.01. 08:00",
            "15.01. 08:30",
            "15.01. 09:00",
            "15.01. 09:30",
            "15.01. 10:00",
            "15.01. 10:30",
            "15.01. 11:00",
            "15.01. 11:30",
            "15.01. 12:00",
            "15.01. 12:30",
            "15.01. 13:00",
            "15.01. 13:30",
            "15.01. 14:00",
            "15.01. 14:30",
            "15.01. 15:00",
            "15.01. 15:30",
            "15.01. 16:00",
            "15.01. 16:30",
            "15.01. 17:00",
            "15.01. 17:30",
            "15.01. 18:00",
            "15.01. 18:30",
            "15.01. 19:00",
            "15.01. 19:30",
            "15.01. 20:00",
            "15.01. 20:30",
            "15.01. 21:00",
            "15.01. 21:30",
            "16.01. 06:00",
            "16.01. 06:30",
            "16.01. 07:00",
            "16.01. 07:30",
            "16.01. 08:00",
            "16.01. 08:30",
            "16.01. 09:00",
            "16.01. 09:30",
            "16.01. 10:00",
            "16.01. 10:30"
          ]
        }
        

        Eigentlich mit stadartmitteln in eine graphische ansicht wandeln?
        muss ich da was beachten ?
        bei vis gabs dafür die vom material desinge den json-chart der das konnte. steh grad mal wieder am schlauch versuche das ganze möglichst ohne umbauten zu übernehmen ;)

        screen "chart sample"

        schau dir den screen "chart sample2" an, füg deine daten in die textarea ein, und verlasse sie (die daten werden bei lost focus -> change übernommen)

        461f0eb2-6623-4a38-86f6-1cf7afcebb5f-image.png

        d7efd71e-e6ea-4e87-bfa5-47bbaab4d387-image.png

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

        Smilie108S 1 Reply Last reply
        1
        • B Blockmove

          @jogibear9988

          Hallo Jochen,
          ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
          webui-Version 1.0.15

          VG
          Dieter

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

          @blockmove said in neue Visualisierung "webui" (alternative zu vis):

          @jogibear9988

          Hallo Jochen,
          ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
          webui-Version 1.0.15

          VG
          Dieter

          ???

          geht bei mir:

          21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

          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 said in neue Visualisierung "webui" (alternative zu vis):

            @jogibear9988

            Hallo Jochen,
            ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
            webui-Version 1.0.15

            VG
            Dieter

            ???

            geht bei mir:

            21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

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

            @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

            @blockmove said in neue Visualisierung "webui" (alternative zu vis):

            @jogibear9988

            Hallo Jochen,
            ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
            webui-Version 1.0.15

            VG
            Dieter

            ???

            geht bei mir:

            21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

            War es nicht in den vorherigen Versionen so, dass man bei Suggestions mit Rechtsklick auf ein Package (z.B. material/web) das Package dann installieren konnte?

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

            jogibear9988J 1 Reply Last reply
            0
            • B Blockmove

              @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

              @blockmove said in neue Visualisierung "webui" (alternative zu vis):

              @jogibear9988

              Hallo Jochen,
              ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
              webui-Version 1.0.15

              VG
              Dieter

              ???

              geht bei mir:

              21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

              War es nicht in den vorherigen Versionen so, dass man bei Suggestions mit Rechtsklick auf ein Package (z.B. material/web) das Package dann installieren konnte?

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

              @blockmove said in neue Visualisierung "webui" (alternative zu vis):

              @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

              @blockmove said in neue Visualisierung "webui" (alternative zu vis):

              @jogibear9988

              Hallo Jochen,
              ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
              webui-Version 1.0.15

              VG
              Dieter

              ???

              geht bei mir:

              21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

              War es nicht in den vorherigen Versionen so, dass man bei Suggestions mit Rechtsklick auf ein Package (z.B. material/web) das Package dann installieren konnte?

              nö, einfach doppelklicken

              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 said in neue Visualisierung "webui" (alternative zu vis):

                @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

                @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                @jogibear9988

                Hallo Jochen,
                ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
                webui-Version 1.0.15

                VG
                Dieter

                ???

                geht bei mir:

                21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

                War es nicht in den vorherigen Versionen so, dass man bei Suggestions mit Rechtsklick auf ein Package (z.B. material/web) das Package dann installieren konnte?

                nö, einfach doppelklicken

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

                @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

                @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

                @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                @jogibear9988

                Hallo Jochen,
                ich wollte gerade das node-projects Package installieren und hab dabei festgestellt, dass ich keine Packages mehr installieren kann. Das Kontextmenu mit "Install Package" öffnet sich nicht.
                webui-Version 1.0.15

                VG
                Dieter

                ???

                geht bei mir:

                21c05e4a-a15e-42eb-9cb1-ebfe7b18ca89-image.png

                War es nicht in den vorherigen Versionen so, dass man bei Suggestions mit Rechtsklick auf ein Package (z.B. material/web) das Package dann installieren konnte?

                nö, einfach doppelklicken

                Hab's mal im Wiki notiert.

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

                1 Reply Last reply
                1
                • jogibear9988J jogibear9988

                  @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

                  @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                  @Blockmove
                  Kann man den graph aus pvvorcast

                  {
                    "graphs": [
                      {
                        "data": [
                          0.962,
                          1.732,
                          2.449,
                          3.086,
                          3.623,
                          4.048,
                          4.242,
                          4.527,
                          4.559,
                          4.425,
                          4.095,
                          3.475,
                          1.691,
                          0.019,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0.031,
                          0.152,
                          0.28,
                          0.398,
                          0.476,
                          0.518,
                          0.522,
                          0.518,
                          0.507,
                          0.482,
                          0.441,
                          0.367,
                          0.257,
                          0.144,
                          0.05,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0,
                          0.021,
                          0.05,
                          0.104,
                          0.24
                        ],
                        "type": "bar",
                        "legendText": "Total",
                        "displayOrder": 1,
                        "color": "#000000",
                        "tooltip_AppendText": "kW",
                        "datalabel_show": true,
                        "datalabel_rotation": 270,
                        "datalabel_color": "#cccccc",
                        "datalabel_fontSize": 12,
                        "yAxis_id": 0,
                        "yAxis_position": "left",
                        "yAxis_show": true,
                        "yAxis_appendix": "kW",
                        "yAxis_step": 1,
                        "yAxis_max": 7,
                        "yAxis_maximumDigits": 3
                      }
                    ],
                    "axisLabels": [
                      "14.01. 10:30",
                      "14.01. 11:00",
                      "14.01. 11:30",
                      "14.01. 12:00",
                      "14.01. 12:30",
                      "14.01. 13:00",
                      "14.01. 13:30",
                      "14.01. 14:00",
                      "14.01. 14:30",
                      "14.01. 15:00",
                      "14.01. 15:30",
                      "14.01. 16:00",
                      "14.01. 16:30",
                      "14.01. 17:00",
                      "14.01. 17:30",
                      "14.01. 18:00",
                      "14.01. 18:30",
                      "14.01. 19:00",
                      "14.01. 19:30",
                      "14.01. 20:00",
                      "14.01. 20:30",
                      "14.01. 21:00",
                      "14.01. 21:30",
                      "15.01. 06:00",
                      "15.01. 06:30",
                      "15.01. 07:00",
                      "15.01. 07:30",
                      "15.01. 08:00",
                      "15.01. 08:30",
                      "15.01. 09:00",
                      "15.01. 09:30",
                      "15.01. 10:00",
                      "15.01. 10:30",
                      "15.01. 11:00",
                      "15.01. 11:30",
                      "15.01. 12:00",
                      "15.01. 12:30",
                      "15.01. 13:00",
                      "15.01. 13:30",
                      "15.01. 14:00",
                      "15.01. 14:30",
                      "15.01. 15:00",
                      "15.01. 15:30",
                      "15.01. 16:00",
                      "15.01. 16:30",
                      "15.01. 17:00",
                      "15.01. 17:30",
                      "15.01. 18:00",
                      "15.01. 18:30",
                      "15.01. 19:00",
                      "15.01. 19:30",
                      "15.01. 20:00",
                      "15.01. 20:30",
                      "15.01. 21:00",
                      "15.01. 21:30",
                      "16.01. 06:00",
                      "16.01. 06:30",
                      "16.01. 07:00",
                      "16.01. 07:30",
                      "16.01. 08:00",
                      "16.01. 08:30",
                      "16.01. 09:00",
                      "16.01. 09:30",
                      "16.01. 10:00",
                      "16.01. 10:30"
                    ]
                  }
                  

                  Eigentlich mit stadartmitteln in eine graphische ansicht wandeln?
                  muss ich da was beachten ?
                  bei vis gabs dafür die vom material desinge den json-chart der das konnte. steh grad mal wieder am schlauch versuche das ganze möglichst ohne umbauten zu übernehmen ;)

                  screen "chart sample"

                  schau dir den screen "chart sample2" an, füg deine daten in die textarea ein, und verlasse sie (die daten werden bei lost focus -> change übernommen)

                  461f0eb2-6623-4a38-86f6-1cf7afcebb5f-image.png

                  d7efd71e-e6ea-4e87-bfa5-47bbaab4d387-image.png

                  Smilie108S Online
                  Smilie108S Online
                  Smilie108
                  wrote on last edited by
                  #525

                  @jogibear9988 DANKE ;)

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

                    Hab grad noch .16 freigegeben, nun sollte das drag/drop auf nicht aufgeklappte treenodes funktionieren

                    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
                      #527

                      selection im split view text, selektiert nun auch im designer

                      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
                        #528

                        Simlere Binding Syntax mit expressions:

                        Wenn Ihr in euerem Binding nun nur Variablen habt, und Expressions ohne ";" und ohne Zeilenumbruch, dann werden die bindings so ins HTML geschrieben:

                         <div bind-content:html="a:a.b.cvar1;b:a.b.c.varb;a + ' ' + b">
                        

                        das heißt, auch die bindings mit expressions sollten in HTML lesbar sein.

                        Nun ist noch die Frage, brauchen wir noch bindings im CSS editor? Hatte mit überlegt, z.b.: mit 2 klammern : ”{{bindingexpression}}" ein binding zu erzeugen.
                        Wird sowas benötigt?
                        Es geht ja auch jetzt schon, wenn ich CSS Variablen nutze, und die außerhalb an einem Control Binde.
                        Ich könnte natürlich über die Expression auch einfach dynamisch eine CSS Variable erzeugen (dann könnte man das binding aber nur für einfache css werte nutzen), oder ich ersetze jedes mal wenn sich am binding was ändert immer wieder den ganzen style (ist sicher langsamer, aber merkt man es? aber dadurch wäre auch mehr möglich)

                        Bsp:

                         {
                            width: calc({{a.b.c}} * 1px)
                            height: {{a:c.d.e;a + 'px'}}
                         }
                        

                        ginge mit Variante 1 und 2. Bei Variante1 würde ich das entsprechend so transformieren:

                         {
                            width: calc(var(--tmpVar1) * 1px);
                            height: var(--tmpVar2);
                         }
                        

                        das folgende:

                         {
                             {{v:a.b.c;'width : ' + v + 'px'}}
                         }
                        

                        ginge nur mit Variante 2, die frage ist bräuchte man das? Also das Ihr dynamisch per binding nicht nur werte, sondern auch css properties hinzufügt.

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

                        Smilie108S 1 Reply Last reply
                        0
                        • jogibear9988J jogibear9988

                          Simlere Binding Syntax mit expressions:

                          Wenn Ihr in euerem Binding nun nur Variablen habt, und Expressions ohne ";" und ohne Zeilenumbruch, dann werden die bindings so ins HTML geschrieben:

                           <div bind-content:html="a:a.b.cvar1;b:a.b.c.varb;a + ' ' + b">
                          

                          das heißt, auch die bindings mit expressions sollten in HTML lesbar sein.

                          Nun ist noch die Frage, brauchen wir noch bindings im CSS editor? Hatte mit überlegt, z.b.: mit 2 klammern : ”{{bindingexpression}}" ein binding zu erzeugen.
                          Wird sowas benötigt?
                          Es geht ja auch jetzt schon, wenn ich CSS Variablen nutze, und die außerhalb an einem Control Binde.
                          Ich könnte natürlich über die Expression auch einfach dynamisch eine CSS Variable erzeugen (dann könnte man das binding aber nur für einfache css werte nutzen), oder ich ersetze jedes mal wenn sich am binding was ändert immer wieder den ganzen style (ist sicher langsamer, aber merkt man es? aber dadurch wäre auch mehr möglich)

                          Bsp:

                           {
                              width: calc({{a.b.c}} * 1px)
                              height: {{a:c.d.e;a + 'px'}}
                           }
                          

                          ginge mit Variante 1 und 2. Bei Variante1 würde ich das entsprechend so transformieren:

                           {
                              width: calc(var(--tmpVar1) * 1px);
                              height: var(--tmpVar2);
                           }
                          

                          das folgende:

                           {
                               {{v:a.b.c;'width : ' + v + 'px'}}
                           }
                          

                          ginge nur mit Variante 2, die frage ist bräuchte man das? Also das Ihr dynamisch per binding nicht nur werte, sondern auch css properties hinzufügt.

                          Smilie108S Online
                          Smilie108S Online
                          Smilie108
                          wrote on last edited by
                          #529

                          @jogibear9988 sagte in neue Visualisierung "webui" (alternative zu vis):

                          hi jochen
                          Habe mich inzwischen mit der mittleren variate angefreundet dann kannst du eh sogut wie alles machen ( mit namen muss mann halt ein wenig erfinderisch sein ;) )
                          mir langt das weis jetzt nicht ob das andere notwendig ist.

                          Das was mir noch kopfzerbrechen macht aber ich glaube ich fange da mal wieder falsch an ist das ich zb einen navigationstree erstellen wollte ( eigene seite) und dann in dieser javascript verwenden wollte. ( Standart kopiert) das geht aber garnicht.

                          z.b.
                          https://github.com/gero1992/side-menu
                          oder zb.:
                          https://www.w3schools.com/howto/howto_js_treeview.asp

                          aber da ich auch sonst noch genug zu tun habe habe ich das nach hinten verschoben ;)

                          MFG und DANKE bis jeztt geht das eht inzwischen richtig gut wenn man mal etwas sich reingefuchst hat ;)

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

                            @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                            https://github.com/gero1992/side-menu

                            2 Probleme:

                            • du musst das als NPM Paket hinzufügen: "@maksu/side-menu", da er aber eine alter version von lit-element nutzt, und aber eine neue version von lit-html installiert sein kann, gibts bei mir z.b. probleme, daher muss ich auch das npm paket "lit-element@latest" hinzufügen.
                            • da er im NPM Paket nur auf "side-menu.js" verweist, muss man "side-menu-item.js" selber importieren. Das sollte er im Paket am besten fixen. (issue dazu: https://github.com/gero1992/side-menu/issues/2 (upvoten))

                            e4fbccec-e9ad-4ea0-bb39-acfb1404ff1e-image.png

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

                            1 Reply Last reply
                            0
                            • Smilie108S Smilie108

                              @jogibear9988 sagte in neue Visualisierung "webui" (alternative zu vis):

                              hi jochen
                              Habe mich inzwischen mit der mittleren variate angefreundet dann kannst du eh sogut wie alles machen ( mit namen muss mann halt ein wenig erfinderisch sein ;) )
                              mir langt das weis jetzt nicht ob das andere notwendig ist.

                              Das was mir noch kopfzerbrechen macht aber ich glaube ich fange da mal wieder falsch an ist das ich zb einen navigationstree erstellen wollte ( eigene seite) und dann in dieser javascript verwenden wollte. ( Standart kopiert) das geht aber garnicht.

                              z.b.
                              https://github.com/gero1992/side-menu
                              oder zb.:
                              https://www.w3schools.com/howto/howto_js_treeview.asp

                              aber da ich auch sonst noch genug zu tun habe habe ich das nach hinten verschoben ;)

                              MFG und DANKE bis jeztt geht das eht inzwischen richtig gut wenn man mal etwas sich reingefuchst hat ;)

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

                              @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                              Habe mich inzwischen mit der mittleren variate angefreundet dann kannst du eh sogut wie alles machen ( mit namen muss mann halt ein wenig erfinderisch sein ;) )
                              mir langt das weis jetzt nicht ob das andere notwendig ist.

                              Ich schließ mich da an.

                              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
                                #532

                                Hallo Jochen,

                                ich habe gerade etwas "entdeckt".

                                Ich habe bei mir einige Screens in einen Ordner "subscreen" verschoben.
                                Will ich nun in der Splitview den Ordnernamen ändern, so wird die Änderung nicht übernommen.
                                subscreen1.png
                                In der Property wird Namen des Unterordners nicht übernommen.

                                Wenn ich den Screename direkt in der Property ändere, dann funktioniert es.
                                subscreen2.png

                                Version: 1.0.19

                                VG
                                Dieter

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

                                jogibear9988J 1 Reply Last reply
                                0
                                • H Do not disturb
                                  H Do not disturb
                                  Hansi1234
                                  wrote on last edited by
                                  #533

                                  Hi, ich konnte jetzt auf die schnelle nichts finden.
                                  Gibt es in webui so etwas wie ein circle Menü?
                                  Fhem hat sowas zb
                                  link

                                  jogibear9988J 1 Reply Last reply
                                  0
                                  • B Blockmove

                                    Hallo Jochen,

                                    ich habe gerade etwas "entdeckt".

                                    Ich habe bei mir einige Screens in einen Ordner "subscreen" verschoben.
                                    Will ich nun in der Splitview den Ordnernamen ändern, so wird die Änderung nicht übernommen.
                                    subscreen1.png
                                    In der Property wird Namen des Unterordners nicht übernommen.

                                    Wenn ich den Screename direkt in der Property ändere, dann funktioniert es.
                                    subscreen2.png

                                    Version: 1.0.19

                                    VG
                                    Dieter

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

                                    @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                                    Hallo Jochen,

                                    ich habe gerade etwas "entdeckt".

                                    Ich habe bei mir einige Screens in einen Ordner "subscreen" verschoben.
                                    Will ich nun in der Splitview den Ordnernamen ändern, so wird die Änderung nicht übernommen.
                                    subscreen1.png
                                    In der Property wird Namen des Unterordners nicht übernommen.

                                    Wenn ich den Screename direkt in der Property ändere, dann funktioniert es.
                                    subscreen2.png

                                    Version: 1.0.19

                                    VG
                                    Dieter

                                    sollte gefixt sein, kamm durch mein umbau das man auch im split view im text elemente selektieren kann

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

                                    1 Reply Last reply
                                    0
                                    • H Hansi1234

                                      Hi, ich konnte jetzt auf die schnelle nichts finden.
                                      Gibt es in webui so etwas wie ein circle Menü?
                                      Fhem hat sowas zb
                                      link

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

                                      @hansi1234 said in neue Visualisierung "webui" (alternative zu vis):

                                      Hi, ich konnte jetzt auf die schnelle nichts finden.
                                      Gibt es in webui so etwas wie ein circle Menü?
                                      Fhem hat sowas zb
                                      link

                                      bspw: https://www.fabiovitali.it/radial/

                                      hab auch noch das gefunden: https://github.com/mmontoya/radial-menu
                                      ist ne webcomponente, geht aber gerade nicht, stencil erzeugt keinen code den man direkt als esm im browser importieren kann

                                      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
                                        #536

                                        Screen "radialmenu" im testserver

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

                                        H 1 Reply Last reply
                                        1
                                        • jogibear9988J jogibear9988

                                          Screen "radialmenu" im testserver

                                          H Do not disturb
                                          H Do not disturb
                                          Hansi1234
                                          wrote on last edited by
                                          #537

                                          @jogibear9988 puh, ich muss hier Mal mein Dank für deine erbrachte Arbeit da lassen. Vielen Dank!!! 😊

                                          1 Reply 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

                                          892

                                          Online

                                          32.4k

                                          Users

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