Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Codierknecht]

@martinsu
nimm doch einfach ein <pre>

[MartinSU]

@codierknecht
ich möchte einfach eine kleine Tabelle in VIS (1) anzeigen, z.B.:

** Jan  Feb Mrz Apr
111,1  112,2  113,3 114,4
211,1  212,2  213,3 214,4
311,1  312,2  313,3 314,4

(natürlich sauber formatiert)
Jede Zeile in einem String erzeugt und jeweils in ein "basic-string" oder "basic-string unescaped" oder "basic-HTML" kopiert.
Nur wenn ich die Leerzeichen durch Punkte ersetze, ist die Tabelle sauber formatiert.

[Homoran]

@martinsu sagte in Kleine Tabelle mit Monospace Font klappt nicht:

natürlich sauber formatiert)

ich hab"s versucht ;-)

[MartinSU]

@homoran
:+1:
und wie geht das in VIS? :grinning:

[Homoran]

@martinsu ich hab v8n Tabellenbau keine Ahnung, hab mir das bisher aus hundert Widgers gebastelt

aber im Prinzip müsdte man das mit HTML Kenntnissen hinbekommen.
Vielleicht kann dir da @Codierknecht weiterhelfen

[MartinSU]

@homoran
@codierknecht
das wollte ich gerade vermeiden, wenn man da etwas verschieben möchte.....
Ich habe auch mal "basic-Table" und "Materialdesign-Table" versucht, bin aber gescheitert.
Kennt sich damit jemand aus?

[MartinP]

@martinsu Ich habe eine Tabelle einfach mit dem HTML Widget und dem üblichen HTML Code gebaut...

[MartinSU]

@martinp
hast Du ein Beispiel?
Auch wie Du den Inhalt erzeugt hast?

[MartinP]

@martinsu

Wenn man auf den Stift klickt, kann man das HTML editieren:

<table>
  <tr><th>Volume</th><th>F&uuml;llstand %</th></tr>
  <tr><td>Proxmox</td><td>{linux-control.0.proxmox.BootDisk}</td></tr>
  <tr><td>data</td><td>{linux-control.0.proxmox.Intenso-Data}</td></tr>
  <tr><td>backup</td><td>{linux-control.0.proxmox.Intenso-Backup}</td></tr>
  <tr><td>unterhaltung</td><td>{linux-control.0.proxmox.Intenso-Unterhaltung}</td></tr>
  <tr><td>docker</td><td>{linux-control.0.docker.docker-volume}</td></tr>
  <tr><td>iobroker</td><td>{linux-control.0.iobroker.iobroker-volume}</td></tr>
  <tr><td>frigate</td><td>{linux-control.0.frigate.frigate-volume}</td></tr>
  <tr><td>deb-test</td><td>{linux-control.0.debian.debian-test-volume}</td></tr>
</table>

Für den Rahmen kann man da noch basteln, entweder Stylesheet oder in die Table

ich habe es im CSS Reiter des Widgets gemacht. Border-collapse hat nicht funktioniert. Bleiben Doppellinien...

.table, td, th{
  border: 1px solid black;
  border-collapse: collapse;
}

[Codierknecht]

Ich würde das per Script in ein JSON klöppeln und in Vis eine Json-Table verwenden.

[MartinSU]

@martinp
ich habe Deine Tabelle als Grundlage genommen und meine Werte eingesetzt, noch nicht komplett.

Wie kann man die Werte rechtsbündig machen?
Und wie kann man eine Nachkommastelle erzwingen (auch wenn sie "0" ist)
Hast Du da noch einen Tipp?

[MartinSU]

@codierknecht
JSON habe ich auch schon probiert, aber die Zähne daran ausgebissen....
Hast Du ein Beispiel?

[MartinP]

@martinsu sagte in Kleine Tabelle mit Monospace Font klappt nicht:

Hast Du da noch einen Tipp?

https://wiki.selfhtml.org/wiki/Tabellen/Gestaltung_mit_CSS

Text-align

[Codierknecht]

@martinsu sagte in Kleine Tabelle mit Monospace Font klappt nicht:

Hast Du ein Beispiel?

[
  {
    "**": 1,
    "Jan": 2.34,
    "Feb": 3
  },{
    "**": 5,
    "Jan": 6,
    "Feb": 7
  }
]

Stylen kann man das dann per CSS

[MartinP]

@codierknecht Die hatte ich auch am Wickel... Da klappten aber Bindings in Tabellenelemente irgendwie nicht....

Statische Tabellen sind ja langweilig....

[Codierknecht]

@martinp sagte in Kleine Tabelle mit Monospace Font klappt nicht:

Da klappten aber Bindings in Tabellenelemente irgendwie nicht

Funzt wunderbar :grin:

[
  {
    "**": 1,
    "Jan": {0_userdata.0.Test.differenz},
    "Feb": 3
  },{
    "**": 5,
    "Jan": 6,
    "Feb": 7
  }
]

[MartinSU]

@codierknecht
Ich probiere gerade HTML, klappt auch relativ gut, aber...

... in der 5 Zeile, 10. Spalte rastet er immer aus.
Habe in der Zeile auch schon ab Juli die Januar-Werte hinkopiert,
und die erste Zeile weggelassen, aber...
Morgen ist auch noch ein Tag, dann werde ich auch noch mal JSON probieren, sieht gut aus bei Dir....

[Codierknecht]

@martinsu
Die Anzahl an Bindings pro Widget ist begrenzt. Soweit mir bekannt auf 50.
Das würde das Verhalten dann auch erklären.

Das ist aber ja auch eine ziemlich statische Tabelle, die sich nur 1x im Monat ändert. Da kann man das JSON auch komplett per Script zusammenbauen.

[MartinP]

@codierknecht sagte in Kleine Tabelle mit Monospace Font klappt nicht:

Da kann man das JSON auch komplett per Script zusammenbauen.

Wie meinst Du das?

Direkt das komplette JSON in einen Userdata-Datenpunkt?

Oder kann man per Script aus dem View Daten aus dem iobroker auslesen?

[Codierknecht]

@martinp sagte in Kleine Tabelle mit Monospace Font klappt nicht:

Wie meinst Du das?

genau so:

Direkt das komplette JSON in einen Userdata-Datenpunkt?

Wenn's sich nur 1x im Monat ändert, wäre das der effizientere Weg.