Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Off Topic
    4. Einfache Tabelle in VIS mit Daten füllen

    NEWS

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Einfache Tabelle in VIS mit Daten füllen

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

      Hallo zusammen, ich habe zu dem was ich vor habe schon einiges versucht hier im Forum herauszufinden bzw. zu lesen. Leider ist wie immer der Anfang schwer, ich möchte einfach erstmal nur einige Werte z.B. Temperaturen in einer Tabelle anzeigen lassen, damit das ganze im View etwas übersichtlicher wird, vlt. kann mir ja mal jemand ein einfache kurze Anleitung geben oder ein fertig parametriertes Widget als Vorlage zur Verfügung stellen?
      Ich könnte mir eine Tabelle mit 5 Zeilen und 3 Spalten.

      ---------|Werte 1 | Werte 1| Werte 3|------------------------
      Raum 1 | xx | xx | xx |

      Raum 2 | xx | xx | xx |

      Raum 3 | xx | xx | xx |

      Raum 4 | xx | xx | xx |

      Raum 5 | xx | xx | xx |

      Danke vorab!

      OliverIO BananaJoe 2 Replies Last reply Reply Quote 0
      • OliverIO
        OliverIO @jan_xx last edited by

        @jan_xx

        Mit Binding in einem vis-html-widget.
        Es gibt aber eine begrenzung von max 50 bindings pro Widget
        Das folgende beschreibt eine html-tabelle
        https://wiki.selfhtml.org/wiki/HTML/Tabellen/Aufbau_einer_Tabelle

        <table>
            <tr>
                <th></th>
                <th>Wert1</th>
                <th>Wert2</th>
                <th>Wert3</th>
            </tr>
            <tr>
                <td>Raum1</th>
                <td>{javascript.0.Raum1Wert1}</td>
                <td>{javascript.0.Raum1Wert2}</td>
                <td>{javascript.0.Raum1Wert3}</td>
            </tr>
            <tr>
                <td>Raum2</th>
                <td>{javascript.0.Raum2Wert1}</td>
                <td>{javascript.0.Raum2Wert2}</td>
                <td>{javascript.0.Raum2Wert3}</td>
            </tr>
        </table>
        
        
        metaxa 1 Reply Last reply Reply Quote 1
        • BananaJoe
          BananaJoe Most Active @jan_xx last edited by BananaJoe

          @jan_xx Ich nutze dafür JSON.

          Also bereite ich meine Daten in einem JSON auf. Konkret baue ich mir in einem JavaScript (Blockly geht auch) die Daten wir folgt zusammen (bezogen auf dein Beispiel oben)

          [
          	{
          		"Raum":"Raum 1",
          		"Wert1":17,
          		"Wert2":66,
          		"Wert3":34
          	},
          	{
          		"Raum":"Raum 2",
          		"Wert1":71,
          		"Wert2":33,
          		"Wert3":78
          	},
          	{
          		"Raum":"Raum 3",
          		"Wert1":22,
          		"Wert2":33,
          		"Wert3":44
          	}
          ]
          

          und schreibe diese in einen Datenpunkt.
          07a9b248-5b68-4375-995c-e40da8c14d78-image.png

          in VIS nutze ich dann das vis-inventwo - JSON Table Wiget und setze dort den Datenpunkt ein:
          3d7f4c93-58f3-49e3-9324-1db25f1807e9-image.png 688d9ff8-809f-44ff-985c-51e9137d5a06-image.png

          In den Screenshots siehst du das du die Zeilenanzahl anpassen, Überschriften, wieviele Spalten, Splaten umbennen, Reihenfolge der Zeilen und Spalten usw. flexibel umgestalten kannst.

          In der VIS kannst du dann sogar per klick sortieren oder scrollen:
          JSONTable.gif

          Wie du oben sehen konntest gibt es noch andere JSON-Table Widgets, sonst musst du halt schauen welches dir am besten gefällt.

          Mit etwas CSS kann man das dann auch noch aufpimpen:
          e41a9711-9c5d-4881-8198-6329a360ffe1-image.png
          98136969-ee3d-4b4f-a1a4-06d5e7763140-image.png

          1 Reply Last reply Reply Quote 1
          • metaxa
            metaxa @OliverIO last edited by

            @oliverio sagte in Einfache Tabelle in VIS mit Daten füllen:

            Es gibt aber eine begrenzung von max 50 bindings pro Widget

            1 Binding = 1 Wert (egal ob Wert "Raum 1" oder Wert "22°C") ?

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

              @metaxa
              ja, ein Binding ist ein Wert.
              du kannst dir das wie ein Platzhalter vorstellen, an dessen stelle dann der Inhalt des Datenpunkts eingetragen wird.
              Unveränderliche Werte würd ich nun nicht gerade als Binding eintragen. Nur weil du neben 22C auch "Raum1" genannt hast.

              metaxa 1 Reply Last reply Reply Quote 1
              • metaxa
                metaxa @OliverIO last edited by metaxa

                @oliverio sagte in Einfache Tabelle in VIS mit Daten füllen:

                as wie ein Platzhalter vorstellen, an dessen stelle dann der Inhalt des Datenpunkts eingetragen wird.

                Danke! Das wird eine größere Tabelle mit z.B. aktuellen Stromverbraucher heute/gestern/diesen Monat vielleicht auch mit Kosten (alles aus sourceanalytix) doch deutlich einschränken.

                Auf der anderen Seite ein dynamisches Blockly oder JS wie von @BananaJoe beschrieben wird wohl auch sehr viel Rechnerleistung binden.

                paul53 BananaJoe 2 Replies Last reply Reply Quote 0
                • paul53
                  paul53 @metaxa last edited by paul53

                  @metaxa sagte: ein dynamisches Blockly oder JS wie von @BananaJoe beschrieben wird wohl auch sehr viel Rechnerleistung binden.

                  Nein, es wird nur selten getriggert:

                  heute/gestern/diesen Monat

                  metaxa 2 Replies Last reply Reply Quote 0
                  • metaxa
                    metaxa @paul53 last edited by

                    @paul53 Wenn ich auf jeden von ca. 25 Datenpunkten triggere und mir die weiteren Daten laufend ziehe, wird mir meine CPU nicht rauftreiben? Kanns ned wirklich abschätzen wie oft dann die JSON Tabelle pro Minute geschrieben und in VIS dargestellt werden wird.

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

                      @paul53 sagte in Einfache Tabelle in VIS mit Daten füllen:

                      heute/gestern/diesen Monat

                      Sorry, "jetzt" kommt natürlich auch hinzu.

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

                        @metaxa sagte: Wenn ich auf jeden von ca. 25 Datenpunkten triggere

                        Wie oft ändern sich die Werte in den Datenpunkten?
                        Temperaturen ändern sich alle paar Minuten. Die CPU langweilt sich damit.

                        metaxa 1 Reply Last reply Reply Quote 1
                        • metaxa
                          metaxa @paul53 last edited by

                          @paul53 sagte in Einfache Tabelle in VIS mit Daten füllen:

                          Die CPU langweilt sich damit.

                          😊 Dann werde ich mich mal versuchen, danke fürs Mut zusprechen!

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

                            @metaxa

                            ich denke auch das iobroker selbst auf dem raspi mehrere zig datenpunkte pro sekunde gut verarbeiten kann, da das ja alles nur im Hauptspeicher passiert.

                            Bei der höheren Anzahl an Datenpunkte ist die JSON-Lösung von BananaJoe wahrscheinlich besser, wenn du alles in einer Tabelle behalten möchtest,
                            außer du teilst es auf mehrere widgets auf.

                            1 Reply Last reply Reply Quote 1
                            • metaxa
                              metaxa @metaxa last edited by metaxa

                              @metaxa sagte in Einfache Tabelle in VIS mit Daten füllen:

                              @paul53 sagte in Einfache Tabelle in VIS mit Daten füllen:

                              Die CPU langweilt sich damit.

                              Wie oft ändern sich die Werte in den Datenpunkten?

                              Bei 25 DP und einer eingestellten Telemetrie von 60 Sekunden sind das im schlimmsten Falle 25 Änderungen innerhalb 60 Sekunden, oft aber auch nur Bruchteile von Sekunden wahrscheinlich.

                              1 Reply Last reply Reply Quote 0
                              • BananaJoe
                                BananaJoe Most Active @metaxa last edited by

                                @metaxa sagte in Einfache Tabelle in VIS mit Daten füllen:

                                Auf der anderen Seite ein dynamisches Blockly oder JS wie von @BananaJoe beschrieben wird wohl auch sehr viel Rechnerleistung binden.

                                Kosta fast garnix! Ne im Ernst, bei mir laufen so viele Skripte (für jedes Tasmota-Gerät ein eigenes) da fällt das hier gar nicht auf

                                metaxa 1 Reply Last reply Reply Quote 0
                                • metaxa
                                  metaxa @BananaJoe last edited by

                                  @bananajoe sagte in Einfache Tabelle in VIS mit Daten füllen:

                                  Kosta fast garnix!

                                  Kannst du mir als Anhaltspunkt dein Blockly zur händischen JSON Erstellung zeigen? Wie du das ungefähr gemacht hast? Ich raufe hier mit "Erstelle Liste" "Konvertiere zu JSON" Nutze "......"
                                  a0cb7cd6-bc07-4bdb-935a-7c0143bff498-image.png

                                  J 1 Reply Last reply Reply Quote 0
                                  • J
                                    jan_xx @metaxa last edited by jan_xx

                                    @all
                                    danke für die vielen Rückmeldungen, ich werde mich am Wochenende mal damit auseinandersetzen.
                                    Eine Frage noch zu o.g. Beschreibung von BananaJoe, wenn ich anstatt der statischen Werte die Datenpunkte haben möchte schreibe ich was genau als Syntax?

                                    so in etwa?
                                    "Raum":"Raum 1",
                                    "Wert1":hm-rpc.1.IEQ053xxxx.1.VALUE,

                                    J 1 Reply Last reply Reply Quote 0
                                    • J
                                      jan_xx @jan_xx last edited by jan_xx

                                      @jan_xx
                                      also ich komme hier nicht weiter, könnte mich bitte jemand beim urschleim abholen,
                                      ich weiß nicht wo ich was eingeben muss, ich stehe hier völlig auf der Leitung.
                                      Auch mit dem json bekomme ich nicht hin, was muss denn wo rein damit ich überhaupt erstmal etwas sehe?

                                      das ist alles was ich bis jetz hin bekommen habe
                                       <thead>
                                              <tr>
                                                <th></th>
                                                <th>Spalte 1</th>
                                                <th>Spalte2</th>
                                              </tr>
                                          </thead>
                                          <tbody>
                                              <tr>
                                                <th>Wert1</th>
                                                <td>aa </td>
                                                <td>150</td>
                                              </tr>
                                              <tr>
                                                <th>Wert2</th>
                                                <td>50</td>
                                                <td>100</td>
                                              </tr>
                                          </tbody>
                                          <tfoot>
                                              <tr>
                                                <th>Wert3</th>
                                                <td>150</td>
                                                <td>250</td>
                                              </tr>
                                              <tr>
                                                <td colspan="3">Ende der Tabelle.</td>
                                              </tr>
                                          </tfoot>
                                      

                                      jetzt würde ich aber noch gerne zum Beispiel bei aa einen Wert aus den Objekten wiedergeben?

                                      J 1 Reply Last reply Reply Quote 0
                                      • J
                                        jan_xx @jan_xx last edited by

                                        @jan_xx
                                        erste erfolge, ich habe einen Wert der angezeigt wird👍 😊

                                         <thead>
                                                <tr>
                                                  <th></th>
                                                  <th>Spalte 1</th>
                                                  <th>Spalte2</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                  <th>Wert1</th>
                                                  <td>{mqtt.0.vedirect.0.V}Volt </td>
                                                  <td>150</td>
                                                </tr>
                                                <tr>
                                                  <th>Wert2</th>
                                                  <td>50</td>
                                                  <td>100</td>
                                                </tr>
                                            </tbody>
                                            <tfoot>
                                                <tr>
                                                  <th>Wert3</th>
                                                  <td>150</td>
                                                  <td>250</td>
                                                </tr>
                                                <tr>
                                                  <td colspan="3">Ende der Tabelle.</td>
                                                </tr>
                                            </tfoot>
                                        
                                        1 Reply Last reply Reply Quote 1
                                        • OliverIO
                                          OliverIO last edited by

                                          @jan_xx
                                          Dann hab ich mein Beispiel wohl nicht gut genug erklärt, wenn es eine Überraschung für dich ist

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

                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          758
                                          Online

                                          31.7k
                                          Users

                                          79.8k
                                          Topics

                                          1.3m
                                          Posts

                                          5
                                          19
                                          622
                                          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