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. Javascript in vis einfügen

NEWS

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

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

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

Javascript in vis einfügen

Geplant Angeheftet Gesperrt Verschoben Visualisierung
34 Beiträge 4 Kommentatoren 1.7k Aufrufe 6 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.
  • J jumbo125

    @oliverio
    alles klar!

    ich habe gerade herausgefunden, dass das event
    document.ready nicht auslöst wenn meine vis container geladen ist, sondern nur die vis container. es löst viel zu früh aus. daher werden alle meine widget ids nicht gefunden. kennt das problem jemand

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

    @jumbo125 sagte in Javascript in vis einfügen:

    kennt das problem jemand

    ja
    das html wird nicht fertig generiert vom server geladen sondern dynamisch generiert.
    document.ready signalisiert nur, das das was vom server geladen wurde nun vollständig gerendert wurde.
    das da dann programme loslaufen und nachträglich das noch verändert weiß der browser nicht.
    leider besitzt vis ebenfalls keine events die ein irgendwelches fertig signalisiert (widget fertig, view fertig, etc.)

    siehe dieser thread
    https://forum.iobroker.net/topic/48663/howto-skripte-im-vis-editor-mit-jquery?_=1682065519805
    suche nach function waitForElement

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

    J 1 Antwort Letzte Antwort
    0
    • OliverIOO OliverIO

      @jumbo125 sagte in Javascript in vis einfügen:

      kennt das problem jemand

      ja
      das html wird nicht fertig generiert vom server geladen sondern dynamisch generiert.
      document.ready signalisiert nur, das das was vom server geladen wurde nun vollständig gerendert wurde.
      das da dann programme loslaufen und nachträglich das noch verändert weiß der browser nicht.
      leider besitzt vis ebenfalls keine events die ein irgendwelches fertig signalisiert (widget fertig, view fertig, etc.)

      siehe dieser thread
      https://forum.iobroker.net/topic/48663/howto-skripte-im-vis-editor-mit-jquery?_=1682065519805
      suche nach function waitForElement

      J Offline
      J Offline
      jumbo125
      schrieb am zuletzt editiert von
      #19

      @oliverio
      Danke dir!

      J 1 Antwort Letzte Antwort
      0
      • J jumbo125

        @oliverio
        Danke dir!

        J Offline
        J Offline
        jumbo125
        schrieb am zuletzt editiert von
        #20

        Danke euch vielmals!!!!!!

        alles funktioniert. mit dem bockls und debugg habe ich mich schon auseinadergesetzt. Das ist ja wirklich einfach :-)

        was mich noch interessieren würde:
        wie kann man den ins blockly js code einfügen

        bspw wird hier eine debug infos ausgegeben, wenn der Datenpunkt verändert wird.
        Super wäre es, wenn ich einen jquery code statt nur einen Text eintragen kann.

        Sinn dahinter:
        ich habe ein html element (Bild), welches je nach Datenpunkt das bild wechseln soll. Das würde ich nun gerne mit jquery angeben. hier mal das bljavascript_in_blockly.JPG ockly

        danke euch!

        J 1 Antwort Letzte Antwort
        0
        • J jumbo125

          Danke euch vielmals!!!!!!

          alles funktioniert. mit dem bockls und debugg habe ich mich schon auseinadergesetzt. Das ist ja wirklich einfach :-)

          was mich noch interessieren würde:
          wie kann man den ins blockly js code einfügen

          bspw wird hier eine debug infos ausgegeben, wenn der Datenpunkt verändert wird.
          Super wäre es, wenn ich einen jquery code statt nur einen Text eintragen kann.

          Sinn dahinter:
          ich habe ein html element (Bild), welches je nach Datenpunkt das bild wechseln soll. Das würde ich nun gerne mit jquery angeben. hier mal das bljavascript_in_blockly.JPG ockly

          danke euch!

          J Offline
          J Offline
          jumbo125
          schrieb am zuletzt editiert von
          #21

          wenn ich statt Blockly JS wähle und meinen code selbst schreibe, werden befehle wie alert() oder jquery ode nicht interpretiert, sondern als fehler angezeigt. weiß jemand wie man javascript in diesen bereich schreibt?
          danke

          1 Antwort Letzte Antwort
          0
          • J Offline
            J Offline
            jumbo125
            schrieb am zuletzt editiert von
            #22

            geht das nicht?
            ich müsste eine funcktion ausführen, immer wenn ein datenpunkt geändert wird. also mehrere datenpunkte müccten immer bei einer änderung eine funktion ausgeführt werden

            bahnuhrB 1 Antwort Letzte Antwort
            0
            • J jumbo125

              geht das nicht?
              ich müsste eine funcktion ausführen, immer wenn ein datenpunkt geändert wird. also mehrere datenpunkte müccten immer bei einer änderung eine funktion ausgeführt werden

              bahnuhrB Online
              bahnuhrB Online
              bahnuhr
              Forum Testing Most Active
              schrieb am zuletzt editiert von
              #23

              @jumbo125 sagte in Javascript in vis einfügen:

              geht das nicht?

              Nur mal so zum Interesse für mich.
              Du bist neu in JS und VIS (siehe #1).
              Und willst so ein Projekt umsetzen.

              Jeder andere nimmt ein blockly oder ein JS und steuert/reagiert auf die DP.

              Und du willst ein JS in VIS?!
              Warum ?

              Fazit:
              Ich habe mittlerweile 100... Scripte. Und alles funktioniert. Würde gar nicht auf die Idee kommen dies so machen zu wollen.
              Edit: Stimmt nicht. Habe 1 oder 2 Scripte in einem HTML; wurde von mir so übernommen aus dem Forum.


              Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
              Danke.
              gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
              ScreenToGif :https://www.screentogif.com/downloads.html

              J 1 Antwort Letzte Antwort
              0
              • OliverIOO Offline
                OliverIOO Offline
                OliverIO
                schrieb am zuletzt editiert von
                #24

                @jumbo125
                Das JavaScript im JavaScript Adapter wird auf dem Server ausgeführt. Eigentlich heißt es da auch node. Da gibt es auch kein Dokumenten Baum
                Jquery und alert gehen da nucht

                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
                • bahnuhrB bahnuhr

                  @jumbo125 sagte in Javascript in vis einfügen:

                  geht das nicht?

                  Nur mal so zum Interesse für mich.
                  Du bist neu in JS und VIS (siehe #1).
                  Und willst so ein Projekt umsetzen.

                  Jeder andere nimmt ein blockly oder ein JS und steuert/reagiert auf die DP.

                  Und du willst ein JS in VIS?!
                  Warum ?

                  Fazit:
                  Ich habe mittlerweile 100... Scripte. Und alles funktioniert. Würde gar nicht auf die Idee kommen dies so machen zu wollen.
                  Edit: Stimmt nicht. Habe 1 oder 2 Scripte in einem HTML; wurde von mir so übernommen aus dem Forum.

                  J Offline
                  J Offline
                  jumbo125
                  schrieb am zuletzt editiert von
                  #25

                  @bahnuhr
                  Hallo danke dir

                  JS ist nicht neu für mich und ich habe etwa 10 Funktionen schon im html stehen

                  Vielleicht könnt ihr mir ja einen Tipp geben:
                  Ich habe in meiner html ein Fenster abgebildet. Über diesem Bild liegt ein Bild vom Fenster Rollo.
                  Dieses ändert je nach datenpunkt seine Position mit einer Animation.
                  Das funktioniert alles, wenn ich mittels JS den datenpunkt ändere, bspw beim Klick auf einen Button.
                  ABER: wenn ich mit der Fernbedienung beim Fenster das Rollo rauf oder runter steuere ändert sich zwar der datenpjnkt, aber die Animation wird nicht ausgelöst.
                  Daher die frage: Wie kann ich die Position des Bildes im html automatisch ändern bzw die Animation starten, sobald der datenpunkt geändert wird?

                  Danke

                  bahnuhrB 2 Antworten Letzte Antwort
                  0
                  • J jumbo125

                    @bahnuhr
                    Hallo danke dir

                    JS ist nicht neu für mich und ich habe etwa 10 Funktionen schon im html stehen

                    Vielleicht könnt ihr mir ja einen Tipp geben:
                    Ich habe in meiner html ein Fenster abgebildet. Über diesem Bild liegt ein Bild vom Fenster Rollo.
                    Dieses ändert je nach datenpunkt seine Position mit einer Animation.
                    Das funktioniert alles, wenn ich mittels JS den datenpunkt ändere, bspw beim Klick auf einen Button.
                    ABER: wenn ich mit der Fernbedienung beim Fenster das Rollo rauf oder runter steuere ändert sich zwar der datenpjnkt, aber die Animation wird nicht ausgelöst.
                    Daher die frage: Wie kann ich die Position des Bildes im html automatisch ändern bzw die Animation starten, sobald der datenpunkt geändert wird?

                    Danke

                    bahnuhrB Online
                    bahnuhrB Online
                    bahnuhr
                    Forum Testing Most Active
                    schrieb am zuletzt editiert von
                    #26

                    @jumbo125

                    Dann poste doch mal was du hast.
                    widget
                    Script
                    etc.


                    Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                    Danke.
                    gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                    ScreenToGif :https://www.screentogif.com/downloads.html

                    bahnuhrB 1 Antwort Letzte Antwort
                    0
                    • J jumbo125

                      @bahnuhr
                      Hallo danke dir

                      JS ist nicht neu für mich und ich habe etwa 10 Funktionen schon im html stehen

                      Vielleicht könnt ihr mir ja einen Tipp geben:
                      Ich habe in meiner html ein Fenster abgebildet. Über diesem Bild liegt ein Bild vom Fenster Rollo.
                      Dieses ändert je nach datenpunkt seine Position mit einer Animation.
                      Das funktioniert alles, wenn ich mittels JS den datenpunkt ändere, bspw beim Klick auf einen Button.
                      ABER: wenn ich mit der Fernbedienung beim Fenster das Rollo rauf oder runter steuere ändert sich zwar der datenpjnkt, aber die Animation wird nicht ausgelöst.
                      Daher die frage: Wie kann ich die Position des Bildes im html automatisch ändern bzw die Animation starten, sobald der datenpunkt geändert wird?

                      Danke

                      bahnuhrB Online
                      bahnuhrB Online
                      bahnuhr
                      Forum Testing Most Active
                      schrieb am zuletzt editiert von
                      #27

                      @jumbo125
                      Warum nimmst du nicht das hqwidget.
                      Das macht doch alles automatisch, ohne Script.


                      Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                      Danke.
                      gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                      ScreenToGif :https://www.screentogif.com/downloads.html

                      J 1 Antwort Letzte Antwort
                      0
                      • bahnuhrB bahnuhr

                        @jumbo125
                        Warum nimmst du nicht das hqwidget.
                        Das macht doch alles automatisch, ohne Script.

                        J Offline
                        J Offline
                        jumbo125
                        schrieb am zuletzt editiert von
                        #28

                        @bahnuhr klingt gut, schaue ich mir an!

                        1 Antwort Letzte Antwort
                        0
                        • bahnuhrB bahnuhr

                          @jumbo125

                          Dann poste doch mal was du hast.
                          widget
                          Script
                          etc.

                          bahnuhrB Online
                          bahnuhrB Online
                          bahnuhr
                          Forum Testing Most Active
                          schrieb am zuletzt editiert von
                          #29

                          @bahnuhr sagte in Javascript in vis einfügen:

                          Dann poste doch mal was du hast.
                          widget
                          Script
                          etc.

                          würde mich trotzdem interessieren.


                          Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                          Danke.
                          gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                          ScreenToGif :https://www.screentogif.com/downloads.html

                          J 2 Antworten Letzte Antwort
                          0
                          • bahnuhrB bahnuhr

                            @bahnuhr sagte in Javascript in vis einfügen:

                            Dann poste doch mal was du hast.
                            widget
                            Script
                            etc.

                            würde mich trotzdem interessieren.

                            J Offline
                            J Offline
                            jumbo125
                            schrieb am zuletzt editiert von jumbo125
                            #30

                            @bahnuhr
                            vorweg, werde ich natürlich das hq widget verwenden, da es die datenpunkte problemlos anspricht. ich kannte dieses nicht.

                            bisher nutze ich ein einfaches html widget:

                            hier mein html code

                            <div id="wohnzimmer_rollo" class="zimmer_fenster"><h3>Wohnzimmer</h3>
                            <table>
                              <tr>
                                <td class="rollo_img wohnzimmer1"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                <td class="rollo_img wohnzimmer2"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                <td class="rollo_img wohnzimmer3"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                <td class="rollo_img wohnzimmer4"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                              </tr>
                              <tr>
                                <td class="rollo_img" data-room="wohnzimmer1">
                            		<ul>
                            			<li><button id="wohnzimmer1_open" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                            			<li><button id="wohnzimmer1_zu" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                            			<li><button id="wohnzimmer1_75" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                            			<li><button id="wohnzimmer1_50" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                            		</ul>
                            	</td>
                                <td class="rollo_img" data-room="wohnzimmer2">
                            		<ul>
                            			<li><button id="wohnzimmer2_open" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                            			<li><button id="wohnzimmer2_zu" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                            			<li><button id="wohnzimmer2_75" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                            			<li><button id="wohnzimmer2_50" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                            		</ul>
                            	</td>
                                <td class="rollo_img" data-room="wohnzimmer3">
                            		<ul>
                            			<li><button id="wohnzimmer3_open" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                            			<li><button id="wohnzimmer3_zu" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                            			<li><button id="wohnzimmer3_75" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                            			<li><button id="wohnzimmer3_50" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                            		</ul>
                            	</td>
                                <td class="rollo_img" data-room="wohnzimmer4">
                            		<ul>
                            			<li><button id="wohnzimmer4_open" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                            			<li><button id="wohnzimmer4_zu" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                            			<li><button id="wohnzimmer4_75" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                            			<li><button id="wohnzimmer4_50" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                            		</ul>
                            	</td>
                              </tr>
                            
                            </table>
                            </div>
                            

                            der simple jquery test_code(nur ein ausschnit):

                            //move rollo
                            $(document).on("click", ".rollo-btn", function(){
                               var fenster_id = $(this).attr("data-fenster-class");
                               $(document).find("." + fenster_id).each(function(){
                               $(this).find("img").css("marginTop", "0px");    
                               });
                            });
                            

                            hier fährt das rollo einfach nur hinauf. es ist ein snippet welches ausgeführt wird, wenn ddas rollo ganz geöffnet wird

                            1 Antwort Letzte Antwort
                            0
                            • bahnuhrB bahnuhr

                              @bahnuhr sagte in Javascript in vis einfügen:

                              Dann poste doch mal was du hast.
                              widget
                              Script
                              etc.

                              würde mich trotzdem interessieren.

                              J Offline
                              J Offline
                              jumbo125
                              schrieb am zuletzt editiert von
                              #31

                              @bahnuhr
                              weißt du zufällig wofür "Timeout für" steht????
                              vis.JPG

                              bahnuhrB 1 Antwort Letzte Antwort
                              0
                              • J jumbo125

                                @bahnuhr
                                weißt du zufällig wofür "Timeout für" steht????
                                vis.JPG

                                bahnuhrB Online
                                bahnuhrB Online
                                bahnuhr
                                Forum Testing Most Active
                                schrieb am zuletzt editiert von
                                #32

                                @jumbo125

                                Nein,
                                Ich weiß auch gar nicht, was du da für ein widget hast.
                                Die Angabe fehlt.


                                Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                                Danke.
                                gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                                ScreenToGif :https://www.screentogif.com/downloads.html

                                J 1 Antwort Letzte Antwort
                                0
                                • bahnuhrB bahnuhr

                                  @jumbo125

                                  Nein,
                                  Ich weiß auch gar nicht, was du da für ein widget hast.
                                  Die Angabe fehlt.

                                  J Offline
                                  J Offline
                                  jumbo125
                                  schrieb am zuletzt editiert von
                                  #33

                                  @bahnuhr hqwidget, window and shutter.

                                  bahnuhrB 1 Antwort Letzte Antwort
                                  0
                                  • J jumbo125

                                    @bahnuhr hqwidget, window and shutter.

                                    bahnuhrB Online
                                    bahnuhrB Online
                                    bahnuhr
                                    Forum Testing Most Active
                                    schrieb am zuletzt editiert von
                                    #34

                                    @jumbo125 sagte in Javascript in vis einfügen:

                                    @bahnuhr hqwidget, window and shutter.

                                    Hab ich noch nicht probiert.
                                    Steht bei mir auch so drin.


                                    Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                                    Danke.
                                    gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                                    ScreenToGif :https://www.screentogif.com/downloads.html

                                    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

                                    703

                                    Online

                                    32.5k

                                    Benutzer

                                    81.6k

                                    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