Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [Gelöst]Array darstellen in vis

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    SOLVED [Gelöst]Array darstellen in vis

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

      Hi,
      ich habe hier einen array (100) den ich gerne als Tabelle mit einer Spalte und 100 Zeilen darstellen möchte. Jedes Element des Array soll eine Zeile sein.
      Mit welchem Widget mache ich das?
      Kapiere das JSON widget "HTML Table" nicht so recht da kommt nur murks raus.

      Als simple html widget hab ich leider alle Kommas usw mit dargestellt und keine Zeilenumbrüche. Zeilenumbrüche kann ich zur not mit in den Array schreiben.

      Nils

      paul53 1 Reply Last reply Reply Quote 0
      • jmeister79
        jmeister79 @stimezo last edited by

        @stimezo

        Voila!

        var myarray = new Array(100);
        var logbooktemp;
        createState("javascript.0.logbook",'nixx',{type: 'string', name: 'Logbuchobjekt'});
        createState("javascript.0.array_log", JSON.stringify(myarray), {type: 'string',name: 'Logbuchtabelle'});
        
        on({id: 'javascript.0.LogText', change: "ne"}, function (obj) {
          if (getState("javascript.0.LogText").val != 'leer') {
             // Daten in temp Array holen
            myarray = JSON.parse(getState('javascript.0.array_log').val);
            //element vorne anfügen
            myarray.unshift(formatDate(new Date(), "YYYY.MM.DD")+'-'+formatDate(new Date(), "hh:mm:ss")+' - '+getState("javascript.0.LogText").val);
            //letztes element löschen
            myarray.pop();
            //in temp variable schreiben um zu übergeben
            logbooktemp = '';
            for (var n = 99; n >=0; n--){
                logbooktemp = n+" - "+myarray[n]+'<br>'+logbooktemp;
            }
            //json objekt zurückschreiben
            setState('javascript.0.array_log', JSON.stringify(myarray));
            //auslösendes objekt zurücksetzen
            setState("javascript.0.LogText"/*LogText*/, 'leer');
            //ausgabeobjekt zurückschreiben
            setState("javascript.0.logbook"/*LogText*/,logbooktemp);
          }
        });
        
        S 1 Reply Last reply Reply Quote 0
        • S
          stimezo Forum Testing last edited by

          Ich würde per Script das Array in eine HTML Tabelle rendern.
          Da bist Du vollkommen flexibel in der Darstellung.

          Gruß
          Christian

          jmeister79 1 Reply Last reply Reply Quote 0
          • paul53
            paul53 @jmeister79 last edited by

            @jmeister79 sagte:

            JSON widget "HTML Table"

            Vermutlich kommt das JSON widget nicht mit einem echten Array zurecht. Versuche es mal mit einem JSON-String im Datenpunkt.

            setState(id, JSON.stringify(array), true);
            
            jmeister79 1 Reply Last reply Reply Quote 0
            • jmeister79
              jmeister79 @stimezo last edited by

              @stimezo

              öhm und wie?

              S 1 Reply Last reply Reply Quote 0
              • jmeister79
                jmeister79 @paul53 last edited by jmeister79

                @paul53
                Das tue ich schon:

                var n;
                var myarray = new Array(100);
                createState("javascript.0.array_log", JSON.stringify(myarray), {
                    type: 'string',
                    name: 'Logbuchtabelle'
                });
                
                on({id: 'javascript.0.LogText', change: "ne"}, function (obj) {
                  if (getState("javascript.0.LogText").val != 'leer') {
                    myarray = JSON.parse(getState('javascript.0.array_log').val);
                    //alles um einen verschieben
                    for (var n = 99; n >= 1; n--) {
                        myarray[n] = myarray[n-1];
                    }
                    //ins erste element den aktuellen Logeintrag schreiben
                    myarray[0] = getState("javascript.0.LogText").val;
                    setState('javascript.0.array_log', JSON.stringify(myarray));
                    setState("javascript.0.LogText"/*LogText*/, 'leer');
                  }
                });
                

                klappt soweit,
                hab aber auch gar keine ahnung was ich wo bei dem json widget eintragen muss

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

                  Also der array wird wie folgt im normalen html widget dargestellt:

                  ["eintrag","Eintrag2","Eintrag3",....,"letzter eintrag"]

                  Beim HTML Table Widget habe ich keinerlei Ansatzpunkt wie ich die daten darstelle. 😞
                  WEnn ich Den DAtenpnkt eintrage erhalte ich eine Tabelle in der lediglich immer der erste Buchstabe pro Element dargestellt wird bzw wenn ich mehr als eine Spalte einstelle, dann ein Buchstabe pro Zelle.

                  Nils

                  Zum Hintergrund: Ich habe mir ein 100 Elemente Array gebaut um ein Logbuch zu speichern bei dem ich bei ejdem neuen Eitnrag den ältesten hinten rauswerfe, das geht sehr gut mit array. mit einem Text Objekt, wie ich es zur Zeit Habe, müsste man entweder zu einem bestimmte Zeitpunkt flushen oder mit bestimmten Zeichen arbeiten die man im text sucht und ab dann mit dem Text kompliziert arbeitet.

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

                    hat zwar nix mit der Frage zu tun aber für deine Schleife und Einfügen
                    ist unshift und ein pop effizienter
                    https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift

                    1 Reply Last reply Reply Quote 0
                    • S
                      stimezo Forum Testing @jmeister79 last edited by

                      @jmeister79 sagte in Array darstellen in vis:

                      @stimezo

                      öhm und wie?

                      So in etwa:

                      var htmltabelle = "Hier den Header einfügen";
                      
                      for (let i = 0; i < arrayname.length; i++) {
                      
                      htmltabelle=htmltabelle +'<tr>'; 
                      htmltabelle=htmltabelle + arrayname[i];
                      htmltabelle=htmltabelle + '</tr>';
                      }
                      
                      setState("javascript.0.tabellenname", htmltabelle);
                      

                      Gruß
                      Christian

                      jmeister79 1 Reply Last reply Reply Quote 0
                      • jmeister79
                        jmeister79 @stimezo last edited by

                        @stimezo WOW! Super idee oder in eine variable, dass würde mir schon reichen, man darauf hätte ich ja selber kommen können.

                        Dann hab ich alle Vorteile eines Array und benutze die variable zur darstellung.

                        Nils

                        S 1 Reply Last reply Reply Quote 0
                        • S
                          stimezo Forum Testing @jmeister79 last edited by stimezo

                          @jmeister79 sagte in Array darstellen in vis:

                          @stimezo WOW! Super idee oder in eine variable, dass würde mir schon reichen, man darauf hätte ich ja selber kommen können.

                          Dann hab ich alle Vorteile eines Array und benutze die variable zur darstellung.

                          Nils

                          Ja, ist meiner Meinung nach das flexibelste.
                          Kannst Du noch schön mit CSS garnieren.
                          So hübsch kann ein JSON in der Visu aussehen 🙂

                          View DB Ankunft.jpg

                          Gruß
                          Christian

                          jmeister79 1 Reply Last reply Reply Quote 0
                          • jmeister79
                            jmeister79 @stimezo last edited by

                            @stimezo

                            Voila!

                            var myarray = new Array(100);
                            var logbooktemp;
                            createState("javascript.0.logbook",'nixx',{type: 'string', name: 'Logbuchobjekt'});
                            createState("javascript.0.array_log", JSON.stringify(myarray), {type: 'string',name: 'Logbuchtabelle'});
                            
                            on({id: 'javascript.0.LogText', change: "ne"}, function (obj) {
                              if (getState("javascript.0.LogText").val != 'leer') {
                                 // Daten in temp Array holen
                                myarray = JSON.parse(getState('javascript.0.array_log').val);
                                //element vorne anfügen
                                myarray.unshift(formatDate(new Date(), "YYYY.MM.DD")+'-'+formatDate(new Date(), "hh:mm:ss")+' - '+getState("javascript.0.LogText").val);
                                //letztes element löschen
                                myarray.pop();
                                //in temp variable schreiben um zu übergeben
                                logbooktemp = '';
                                for (var n = 99; n >=0; n--){
                                    logbooktemp = n+" - "+myarray[n]+'<br>'+logbooktemp;
                                }
                                //json objekt zurückschreiben
                                setState('javascript.0.array_log', JSON.stringify(myarray));
                                //auslösendes objekt zurücksetzen
                                setState("javascript.0.LogText"/*LogText*/, 'leer');
                                //ausgabeobjekt zurückschreiben
                                setState("javascript.0.logbook"/*LogText*/,logbooktemp);
                              }
                            });
                            
                            S 1 Reply Last reply Reply Quote 0
                            • S
                              stimezo Forum Testing @jmeister79 last edited by

                              @jmeister79 sagte in [Gelöst]Array darstellen in vis:

                              @stimezo

                              Voila!

                              var myarray = new Array(100);
                              var logbooktemp;
                              createState("javascript.0.logbook",'nixx',{type: 'string', name: 'Logbuchobjekt'});
                              createState("javascript.0.array_log", JSON.stringify(myarray), {type: 'string',name: 'Logbuchtabelle'});
                              
                              on({id: 'javascript.0.LogText', change: "ne"}, function (obj) {
                                if (getState("javascript.0.LogText").val != 'leer') {
                                   // Daten in temp Array holen
                                  myarray = JSON.parse(getState('javascript.0.array_log').val);
                                  //element vorne anfügen
                                  myarray.unshift(formatDate(new Date(), "YYYY.MM.DD")+'-'+formatDate(new Date(), "hh:mm:ss")+' - '+getState("javascript.0.LogText").val);
                                  //letztes element löschen
                                  myarray.pop();
                                  //in temp variable schreiben um zu übergeben
                                  logbooktemp = '';
                                  for (var n = 99; n >=0; n--){
                                      logbooktemp = n+" - "+myarray[n]+'<br>'+logbooktemp;
                                  }
                                  //json objekt zurückschreiben
                                  setState('javascript.0.array_log', JSON.stringify(myarray));
                                  //auslösendes objekt zurücksetzen
                                  setState("javascript.0.LogText"/*LogText*/, 'leer');
                                  //ausgabeobjekt zurückschreiben
                                  setState("javascript.0.logbook"/*LogText*/,logbooktemp);
                                }
                              });
                              

                              Das hast Du aber gut gemacht 😉

                              Viele Grüße
                              Christian

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

                              Support us

                              ioBroker
                              Community Adapters
                              Donate

                              854
                              Online

                              31.9k
                              Users

                              80.1k
                              Topics

                              1.3m
                              Posts

                              vis
                              4
                              12
                              1135
                              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