Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [Frage] Widget-Inhalte im zeitlichen Wechsel anzeigen

    NEWS

    • Neues Video über Aliase, virtuelle Geräte und Kategorien

    • Wir empfehlen: Node.js 22.x

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    [Frage] Widget-Inhalte im zeitlichen Wechsel anzeigen

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

      MOD-Edit by eric2905; 12.05.2017 / 12:00; Betreff geändert

      Hallo,

      aus Platzgründen möchte ich gerne in einem meiner Views zwei Widgets zur Anzeige der Luftfeuchtigikeit und der Windgeschwindigkeit meines HomeMatic-Wettersensors übereinander legen und alle 3 Sekunden im Wechsel anzeigen lassen.

      Geht das bzw. gibt es evtl. sogar ein Widget, was das schon von vornherein kann?

      Gruß,

      Thorsten

      1 Reply Last reply Reply Quote 0
      • Dutchman
        Dutchman Developer Most Active Administrators last edited by

        Hmm, zu realisieren mittels Variable= 0 bzw 1 und die Variable per Script alle x Sekunden ändern?

        Sent from my iPhone using Tapatalk

        1 Reply Last reply Reply Quote 0
        • D
          dtp last edited by

          Hatte ich auch schon dran gedacht. Mit dem Skripting vom ioBroker bin ich allerdings noch so gar nicht vertraut. Kann ich damit einen Datenpunkt erzeugen, den ich dann in die Sichtbarkeitsbedingung des Widgets als ID einbinden kann?

          Gruß,

          Thorsten

          1 Reply Last reply Reply Quote 0
          • P
            pix last edited by

            Hallo Thorsten,
            @dtp:

            aus Platzgründen möchte ich gerne in einem meiner Views zwei Widgets zur Anzeige der Luftfeuchtigikeit und der Windgeschwindigkeit meines HomeMatic-Wettersensors übereinander legen und alle 3 Sekunden im Wechsel anzeigen lassen. `
            Ich empfehle, per Script den Inhalt einer Variable abwechselnd mit der Windgeschwindigkeit und der Luftfeuchtigkeit zu füllen. Diese Variable wird dann ganz normal in VIS angezeigt. Sollte ein String sein, damit man die Formatierung und die Einheit gleich mit geben kann.

            Script:

            createState('Wetter', {
                type: 'string',
                name: 'Wetteranzeige (rotierend)',
                def: 'leer'
            });
            
            var idLuftfeuchte = 'hier den HM-Datenpunkt eintragen';
            var idWindspeed = 'hier den HM-Datenpunkt eintragen';
            
            var wetter = [];
            wetter[0] = 'Wetter: ' + getState(idLuftfeuchte).val.toFixed(1) + '% Luftfeuchte'; // eine Dezimalstelle
            wetter[1] = 'Wetter: ' + getState(idWindspeed).val.toFixed(0) + 'km/h Geschwindigkeit'; // keine Dezimalstellen
            // weitere Zeilen nach diesem Muster einfügen
            
            var x=0; // Zähler auf 0
            
            setInterval(function () {
                setState("javascript."+ instance + ".Wetter", wetter[x]); // rotierende Anzeige in Variable schreiben
                x++; // hochzählen
                if (x == wetter.length) x = 0; // wenn zahl der verschiedenen Anzeigen erreicht, wieder nullen.
            }, 10 * 1000); // alle zehn Sekunden
            
            

            Dann den Datenpunkt "javascript.0.Wetter" als ID in das VIS-Widget eintragen.

            Ich empfehle, ein HTML Widget zu verwenden und dann in das Feld HTML das hier einzutragen:

            {javascript.0.Wetter}
            

            Dann lassen sich auch HTML Befehle zur Formatierung (sowas wie span mit style) in die Variable mit einweben.

            Gruß

            Pix

            1 Reply Last reply Reply Quote 0
            • D
              dtp last edited by

              Super. Danke. Werde ich mal ausprobieren.

              Gruß,

              Thorsten

              1 Reply Last reply Reply Quote 0
              • Dutchman
                Dutchman Developer Most Active Administrators last edited by

                Die Lösung von Pix ist sogar viel besser als direkte Antwort auf deine Frage 😉

                Sent from my iPhone using Tapatalk

                1 Reply Last reply Reply Quote 0
                • P
                  pix last edited by

                  Schön, dass es gefällt. 🙂 Ich habe das Skrip noch mal angepasst. Stichwort toFixed().

                  Pix

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

                    Habe es zum "testen" laufen lassen, zeitliche Wechsel vom anzeige funktioniert ganz gut, aber werte vom Temperatur und Feuchte werden nur bei Start vom skript übermittelt und weiter ändern sich nicht.

                    1 Reply Last reply Reply Quote 0
                    • P
                      pix last edited by

                      Das ist natürlich richtig erkannt und mein Fehler :oops: . Ich nutze so eine Konstruktion zur Dastellung von Webcam-Bildern. Da ändert sich nix an der URL, deshalb läuft es. Hier muss dann noch nachgebessert werden, damit entweder

                        1. bei jedem Interval (also hier alle zehn Sekunden) die Wetterdaten neu eingelesen werden:
                      >! ````
                      createState('Wetter', {
                          type: 'string',
                          name: 'Wetteranzeige (rotierend)',
                          def: 'leer'
                      });
                      >! var idLuftfeuchte = 'hier den HM-Datenpunkt eintragen';
                      var idWindspeed = 'hier den HM-Datenpunkt eintragen';
                      >! var wetter = [];
                      function leseWetter() {
                          wetter[0] = 'Wetter: ' + getState(idLuftfeuchte).val.toFixed(1) + '% Luftfeuchte'; // eine Dezimalstelle
                          wetter[1] = 'Wetter: ' + getState(idWindspeed).val.toFixed(0) + 'km/h Geschwindigkeit'; // keine Dezimalstellen
                      // weitere Zeilen nach diesem Muster einfügen 
                      
                      }
                      >! var x=0; // Zähler auf 0
                      >! setInterval(function () {
                          leseWetter();
                          setState("javascript."+ instance + ".Wetter", wetter[x]); // rotierende Anzeige in Variable schreiben
                          x++; // hochzählen
                          if (x == wetter.length) x = 0; // wenn zahl der verschiedenen Anzeigen erreicht, wieder nullen.
                      }, 10 * 1000); // alle zehn Sekunden
                      >! ````
                      
                      oder
                      
                        1. bei jeder Änderung der Wetterwerte, die Variable mit den Wetterdaten neu beschrieben wird:

                        ! createState('Wetter', { type: 'string', name: 'Wetteranzeige (rotierend)', def: 'leer' }); ! var idLuftfeuchte = 'hier den HM-Datenpunkt eintragen'; var idWindspeed = 'hier den HM-Datenpunkt eintragen'; ! var wetter = []; ! on(idLuftfeuchte, function(data) { wetter[0] = 'Wetter: ' + data.state.val.toFixed(1) + '% Luftfeuchte'; // eine Dezimalstelle }); ! on(idWindspeed, function(data) { wetter[1] = 'Wetter: ' + data.state.val.toFixed(0) + 'km/h Geschwindigkeit'; // keine Dezimalstellen }); ! var x=0; // Zähler auf 0 ! setInterval(function () { setState("javascript."+ instance + ".Wetter", wetter[x]); // rotierende Anzeige in Variable schreiben x++; // hochzählen if (x == wetter.length) x = 0; // wenn zahl der verschiedenen Anzeigen erreicht, wieder nullen. }, 10 * 1000); // alle zehn Sekunden !

                      Kann man sich aussuchen. Version 1 braucht weniger Code, Version 2 macht vielleicht deutlich, dass man nur neue Werte braucht, wenn sie sich verändert haben.

                      Gruß

                      Pix

                      1 Reply Last reply Reply Quote 0
                      • D
                        dtp last edited by

                        Hi Pix,

                        nochmals Danke. Bin noch gar nicht zum Ausprobieren gekommen. Muss ich heute Abend mal machen.

                        Kurz noch eine Frage (kenne mich mit Javascript leider nicht aus). Du schreibst "toFixed(0)" heißt zwei Dezimalstellen und toFixed(1) eine Dezimalstelle. Was muss ich denn eingeben, wenn ich gar keine Dezimalstelle haben möchte? Für die Luftfeuchte genügt mir die Angabe als ganze Zahl vollkommen aus.

                        Und noch eine kleine Frage. Wenn mir der reine Zahlenwert genügt, geht das doch mit

                        wetter[0] = getState(idLuftfeuchte).val.toFixed(1);
                        

                        oder?

                        Gruß,

                        Thorsten

                        1 Reply Last reply Reply Quote 0
                        • Homoran
                          Homoran Global Moderator Administrators last edited by

                          @dtp:

                          Was muss ich denn eingeben, wenn ich gar keine Dezimalstelle haben möchte `
                          @dtp:

                          toFixed(0) `
                          :!:

                          1 Reply Last reply Reply Quote 0
                          • P
                            pix last edited by

                            Richtig Homoran und dtp, habe den Skriptkommentar oben editiert, danke für den Hinweis.

                            http://www.w3schools.com/jsref/jsref_tofixed.asp

                            Gruß

                            Pix

                            1 Reply Last reply Reply Quote 0
                            • D
                              dtp last edited by

                              Öh, bin ich jetzt plemplem? Stand da nicht vorhin noch was von zwei Dezimalstellen? :roll: :?

                              Egal, nun macht's Sinn.

                              EDIT: Puh, doch nicht plemplem. :ugeek:

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

                                @pix:

                                  1. bei jeder Änderung der Wetterwerte, die Variable mit den Wetterdaten neu beschrieben wird:

                                  ! createState('Wetter', { type: 'string', name: 'Wetteranzeige (rotierend)', def: 'leer' }); ! var idLuftfeuchte = 'hier den HM-Datenpunkt eintragen'; var idWindspeed = 'hier den HM-Datenpunkt eintragen'; ! var wetter = []; ! on(idLuftfeuchte, function(data) { wetter[0] = 'Wetter: ' + data.state.val.toFixed(1) + '% Luftfeuchte'; // eine Dezimalstelle }); ! on(idWindspeed, function(data) { wetter[1] = 'Wetter: ' + data.state.val.toFixed(0) + 'km/h Geschwindigkeit'; // keine Dezimalstellen }); ! var x=0; // Zähler auf 0 ! setInterval(function () { setState("javascript."+ instance + ".Wetter", wetter[x]); // rotierende Anzeige in Variable schreiben x++; // hochzählen if (x == wetter.length) x = 0; // wenn zahl der verschiedenen Anzeigen erreicht, wieder nullen. }, 10 * 1000); // alle zehn Sekunden ! `

                                Bei der zweite Variante bekomme ich folgendes:

                                ! ````
                                javascript-0 2016-06-27 15:18:05.716 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions.
                                javascript-0 2016-06-27 15:17:55.689 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions.
                                javascript-0 2016-06-27 15:17:45.662 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions.
                                javascript-0 2016-06-27 15:17:35.644 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions.
                                javascript-0 2016-06-27 15:17:25.618 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions.
                                javascript-0 2016-06-27 15:17:15.593 warn Wrong type of javascript.0.Wetter: "undefined". Please fix, while deprecated and will not work in next versions

                                
                                Mein angepasste script:
                                
                                >! ````
                                createState('Wetter', {
                                    type: 'string',
                                    name: 'Wetteranzeige (rotierend)',
                                    def: 'leer'
                                });
                                >! var idLuftfeuchte = 'hm-rpc.0.HEQMEINEHM.1.HUMIDITY';
                                var idTemperatur = 'hm-rpc.0.HEQMEINEHM.1.TEMPERATURE';
                                >! var wetter = [];
                                >! on(idLuftfeuchte, function(data) {
                                    wetter[0] = 'Wetter: ' + data.state.val.toFixed(0) + '% Luftfeuchte';
                                });
                                >! on(idTemperatur, function(data) {
                                    wetter[1] = 'Wetter: ' + data.state.val.toFixed(1) + '°C Lufttemperatur';
                                });
                                >! var x=0; // Zähler auf 0
                                >! setInterval(function () {
                                    setState("javascript."+ instance + ".Wetter", wetter[x]); // rotierende Anzeige in Variable schreiben
                                    x++; // hochzählen
                                    if (x == wetter.length) x = 0; // wenn zahl der verschiedenen Anzeigen erreicht, wieder nullen.
                                }, 10 * 1000); // alle zehn Sekunden
                                

                                MfG

                                Alex

                                1 Reply Last reply Reply Quote 0
                                • D
                                  dtp last edited by

                                  Dummerweise bin ich noch nicht wieder zum Testen des Skripts gekommen. War die letzten Tage mit dem Einrichten meines neuen Surface 3 beschäftigt, das mein iPad Air 2 ablösen soll. Melde mich, sobald ich neue Erkenntnisse gewonnen habe.

                                  Gruß,

                                  Thorsten

                                  1 Reply Last reply Reply Quote 0
                                  • D
                                    dtp last edited by

                                    So, funktioniert super.

                                    Hier mal ein kleines animiertes GIF (einfach drauf klicken, um die Animation zu sehen):

                                    filename="2016-06-29 20h42_56.gif" index="0">~~

                                    Danke,

                                    Thorsten

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

                                      @dtp:

                                      So, funktioniert super. `

                                      Welche Variante hast du jetzt benutzt, bei jedem Interval oder bei jeder Änderung der Werte?

                                      1 Reply Last reply Reply Quote 0
                                      • D
                                        dtp last edited by

                                        Die mit dem Intervall. Allerdings habe ich 3 Sekunden verwendet.

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

                                          @dtp:

                                          Die mit dem Intervall. Allerdings habe ich 3 Sekunden verwendet. `

                                          Alles klar!

                                          Danke für die info.

                                          1 Reply Last reply Reply Quote 0
                                          • D
                                            dtp last edited by

                                            Hi,

                                            ich bin's noch mal. Das obige Skript von @Pix funktioniert bei mir absolut ohne Probleme. Nochmals vielen Dank dafür.

                                            Jetzt habe ich aber eine Situation, wo ich doch eher den periodischen Wechsel zweier übereinander gelegter Widgets benötige. Es geht um folgendes:

                                            Ich lasse mir mit einem Widget den Zustand des Haustürschlosses (verriegelt -> grün, entriegelt -> rot) anzeigen. Nun habe ich das noch um die Zustandsanzeige des Tagesriegels (siehe https://homematic-forum.de/forum/viewtopic.php?f=19&t=36961) erweitert. Aus Platzgründen möchte ich beides an derselben Stelle im View anzeigen. Und zwar derart, dass bei entriegeltem Tagesriegel dessen Widget mit rotem Hintergrund im sekündlichen Wechsel mit dem Haustürschloss-Widget angezeigt wird. Ist der Tagesriegel dagegen verriegelt, soll nur das Haustürschloss-Widget angezeigt werden.

                                            Gibt es eine Möglichkeit, per Javaskript direkt auf die Sichtbarkeit eines Widgets Einfluss zu nehmen?

                                            Gruß,

                                            Thorsten

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            499
                                            Online

                                            32.1k
                                            Users

                                            80.6k
                                            Topics

                                            1.3m
                                            Posts

                                            5
                                            21
                                            3457
                                            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