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. SvgHmi Komponente

NEWS

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    16
    1
    1.6k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    848

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    2.1k

SvgHmi Komponente

Geplant Angeheftet Gesperrt Verschoben Visualisierung
8 Beiträge 2 Kommentatoren 802 Aufrufe 2 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.
  • jogibear9988J Offline
    jogibear9988J Offline
    jogibear9988
    schrieb am zuletzt editiert von
    #1

    Hallo,

    ich arbeite gerade an einer Webcomponente für SvgHmi support. Diese wird dann in WebUi eingebaut.
    (https://github.com/node-projects/svghmi.webcomponent). Vlt. kann diese ja dann auch in Vis/Vis2 genutzt werden.

    Wollte mal wissen, was haltet Ihr von dem Format? Ich finde es eigentlich ganz nützlich für dynamische Grafiken.

    Siehe Infos hierzu:
    http://wtt.vanse.de/2021/10/27/svghmi-dateien-erstellen/
    https://www.youtube.com/watch?v=EHxW9MD5r2Q

    Hoffe bis spätestens Mittwoch was funktionierendes zu haben. Was mi im Moment nicht klar ist, was ist z.B. der Namspace xmlns:hmi-event? Kann das auch schon auf events reagieren?

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

    OliverIOO 1 Antwort Letzte Antwort
    0
    • jogibear9988J jogibear9988

      Hallo,

      ich arbeite gerade an einer Webcomponente für SvgHmi support. Diese wird dann in WebUi eingebaut.
      (https://github.com/node-projects/svghmi.webcomponent). Vlt. kann diese ja dann auch in Vis/Vis2 genutzt werden.

      Wollte mal wissen, was haltet Ihr von dem Format? Ich finde es eigentlich ganz nützlich für dynamische Grafiken.

      Siehe Infos hierzu:
      http://wtt.vanse.de/2021/10/27/svghmi-dateien-erstellen/
      https://www.youtube.com/watch?v=EHxW9MD5r2Q

      Hoffe bis spätestens Mittwoch was funktionierendes zu haben. Was mi im Moment nicht klar ist, was ist z.B. der Namspace xmlns:hmi-event? Kann das auch schon auf events reagieren?

      OliverIOO Offline
      OliverIOO Offline
      OliverIO
      schrieb am zuletzt editiert von OliverIO
      #2

      @jogibear9988

      Aber kann man svg nicht ohne diese Erweiterung bereits dynamisieren?
      Die Eigenschaften von svg Grafiken sind ja ebenfalls mit css Anweisungen bspw mit animate erreichbar

      Wo hätte diese Erweiterung dann seine Vorteile?
      Im Beispiel wird ja einfach nur die Farbe gesetzt.

      Auch svg Elemente und glaube auch die Elemente innerhalb einer svg Grafik
      Können jeweils unterscheidbare Events erhalten gemäß dem normalen Event Modell
      https://wiki.selfhtml.org/wiki/SVG_und_JavaScript/DOM-Scripting

      Meine Adapter und Widgets
      TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
      Links im Profil

      jogibear9988J 2 Antworten Letzte Antwort
      0
      • OliverIOO OliverIO

        @jogibear9988

        Aber kann man svg nicht ohne diese Erweiterung bereits dynamisieren?
        Die Eigenschaften von svg Grafiken sind ja ebenfalls mit css Anweisungen bspw mit animate erreichbar

        Wo hätte diese Erweiterung dann seine Vorteile?
        Im Beispiel wird ja einfach nur die Farbe gesetzt.

        Auch svg Elemente und glaube auch die Elemente innerhalb einer svg Grafik
        Können jeweils unterscheidbare Events erhalten gemäß dem normalen Event Modell
        https://wiki.selfhtml.org/wiki/SVG_und_JavaScript/DOM-Scripting

        jogibear9988J Offline
        jogibear9988J Offline
        jogibear9988
        schrieb am zuletzt editiert von
        #3

        @oliverio

        ja aber nur wenn du SVGs direkt in deinen HTML code einbettest. Und diese SVGs sind dann im Endeffekt auch Komponenten, die spezielle Eigenschaften zur Dynamisierung bereitstellen.

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

        1 Antwort Letzte Antwort
        0
        • OliverIOO OliverIO

          @jogibear9988

          Aber kann man svg nicht ohne diese Erweiterung bereits dynamisieren?
          Die Eigenschaften von svg Grafiken sind ja ebenfalls mit css Anweisungen bspw mit animate erreichbar

          Wo hätte diese Erweiterung dann seine Vorteile?
          Im Beispiel wird ja einfach nur die Farbe gesetzt.

          Auch svg Elemente und glaube auch die Elemente innerhalb einer svg Grafik
          Können jeweils unterscheidbare Events erhalten gemäß dem normalen Event Modell
          https://wiki.selfhtml.org/wiki/SVG_und_JavaScript/DOM-Scripting

          jogibear9988J Offline
          jogibear9988J Offline
          jogibear9988
          schrieb am zuletzt editiert von
          #4

          @oliverio

          Im Beispiel ja, aber schau dir die Doku an. Da sind auch mathematischen Formeln möglich usw.

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

          OliverIOO 1 Antwort Letzte Antwort
          0
          • jogibear9988J jogibear9988

            @oliverio

            Im Beispiel ja, aber schau dir die Doku an. Da sind auch mathematischen Formeln möglich usw.

            OliverIOO Offline
            OliverIOO Offline
            OliverIO
            schrieb am zuletzt editiert von
            #5

            @jogibear9988

            Dafür gibt es mathML
            https://wiki.selfhtml.org/wiki/MathML/Geometrie_mit_MathML,_SVG_und_JavaScript#MathML_in_SVG

            XML ist ja so offen definiert, das ja jeder Erweiterungen definieren kann.
            Wenn dann würde ich aber eher die verfolgen die auch durch das www Konsortium präferiert werden.
            Diese Standards haben eher die Chance auch in den Browsern standardmäßig unterstützt zu werden.

            Meine Adapter und Widgets
            TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
            Links im Profil

            jogibear9988J 1 Antwort Letzte Antwort
            0
            • OliverIOO OliverIO

              @jogibear9988

              Dafür gibt es mathML
              https://wiki.selfhtml.org/wiki/MathML/Geometrie_mit_MathML,_SVG_und_JavaScript#MathML_in_SVG

              XML ist ja so offen definiert, das ja jeder Erweiterungen definieren kann.
              Wenn dann würde ich aber eher die verfolgen die auch durch das www Konsortium präferiert werden.
              Diese Standards haben eher die Chance auch in den Browsern standardmäßig unterstützt zu werden.

              jogibear9988J Offline
              jogibear9988J Offline
              jogibear9988
              schrieb am zuletzt editiert von
              #6

              @oliverio said in SvgHmi Komponente:

              @jogibear9988

              Dafür gibt es mathML
              https://wiki.selfhtml.org/wiki/MathML/Geometrie_mit_MathML,_SVG_und_JavaScript#MathML_in_SVG

              XML ist ja so offen definiert, das ja jeder Erweiterungen definieren kann.
              Wenn dann würde ich aber eher die verfolgen die auch durch das www Konsortium präferiert werden.
              Diese Standards haben eher die Chance auch in den Browsern standardmäßig unterstützt zu werden.

              Mathematische Formeln in den Bindings, nicht zur Darstellung.

              Von Siemens gibts zumindest einige in TIA Portal, und ich will Usern ermöglichen diese weiter zu nutzen.

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

              OliverIOO 1 Antwort Letzte Antwort
              0
              • jogibear9988J jogibear9988

                @oliverio said in SvgHmi Komponente:

                @jogibear9988

                Dafür gibt es mathML
                https://wiki.selfhtml.org/wiki/MathML/Geometrie_mit_MathML,_SVG_und_JavaScript#MathML_in_SVG

                XML ist ja so offen definiert, das ja jeder Erweiterungen definieren kann.
                Wenn dann würde ich aber eher die verfolgen die auch durch das www Konsortium präferiert werden.
                Diese Standards haben eher die Chance auch in den Browsern standardmäßig unterstützt zu werden.

                Mathematische Formeln in den Bindings, nicht zur Darstellung.

                Von Siemens gibts zumindest einige in TIA Portal, und ich will Usern ermöglichen diese weiter zu nutzen.

                OliverIOO Offline
                OliverIOO Offline
                OliverIO
                schrieb am zuletzt editiert von OliverIO
                #7

                @jogibear9988

                Wenn du da spezielle Anwender hast.
                Aber keine Ahnung wie offen das Scada Umfeld da ist.

                Meine Adapter und Widgets
                TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
                Links im Profil

                1 Antwort Letzte Antwort
                0
                • jogibear9988J Offline
                  jogibear9988J Offline
                  jogibear9988
                  schrieb am zuletzt editiert von jogibear9988
                  #8

                  Komponente geht nun...

                  Demo hier: https://node-projects.github.io/web-component-designer-demo/index.html?npm=@node-projects/svghmi.webcomponent@1.0.0&html=<node-projects-svghmi src="https://raw.githubusercontent.com/node-projects/svghmi.webcomponent/refs/heads/main/sample/BatteryCharge.svghmi" -value="60" style="width:331px;height:175px;position:absolute;left:40px;top:74px;"></node-projects-svghmi> <node-projects-svghmi src="https://raw.githubusercontent.com/node-projects/svghmi.webcomponent/refs/heads/main/sample/RegenerativeBlower_WithBox.svghmi" style="width:512px;height:515px;position:absolute;left:456px;top:65px;"></node-projects-svghmi>

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

                  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

                  783

                  Online

                  32.6k

                  Benutzer

                  82.1k

                  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