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

[Martin 5]

Hallo,

vorweg wünsche ich allen einen guten Rutsch ins neue Jahr.

Ich habe ein Control angelegt um eine Zeile in einer "Tabelle" mit Messwerten zu erzeugen. Da verschiedene Einheiten vorhanden sind und alles trotzdem übereinander stehen soll würde ich dem Control gern mitteilen wie breit das Feld für die Einheit werden soll.

<div class="flex">
    <span class="text">[[?this.name]]</span>
    <span class="wert" bind-content:html="?wert">???</span>
    <span class="einheit">[[?this.einheit]]</span>
</div>

Dazu die Style Daten.

div.flex {
    display: flex;
}

span.text {
    width: 100%;
    text-decoration: none;
    color: black;
}

span.wert {
    text-align: right;
    margin-left: auto;
}

span.einheit{
    text-align: left;
    margin-left: 5px;
    width: 50px;
}

Die "50px" (auch als 3em oder so) würde ich dem Control gern über ein Property mitteilen. Also so etwas wie

width: ?propertyname;
oder
width: [[?this.propertyname]];

im Style.

Das soll etwa so aussehen:

Die Messwerte sollen dann nach Bedarf erweitert werden, ich weiß aber noch nicht wie lang die größte Einheit wird.

Kann man das irgendwie machen?

Grüße Martin

[Martin 5]

Hallo,

allen ein gesundes und erfolgreiches Neues Jahr.

Mal eine Nacht drüber schlafen und man kommt selber drauf. :-)

<span class="einheit" bind-css:width="??propertyname">[[?this.einheit]]</span>

Grüße Martin

[Kamikaze]

Auch von mir ein gutes neues Jahr und das es so erfolgreich wie 2025 wird.
Es ist wieder soweit, ich stehe auf dem Schlauch.
Ziemlich einfaches Szenario, aber ich bekomme es nicht hin.
Ich möchte mit chart.js meine eigenen Grafiken bereitstellen.
Über einen Datenpunkt im iobroker lege ich die Parameter für die Grafik fest.
In einem früheren Post hat jogibear davon gesprochen, dass man auch seine Lösung verwenden kann. Auf dem testserver finde ich hierzu nicht passendes.
Also meine Frage:
Wie und wo muss ich genau die Chart.js Komponenten einbinden, damit ich diese in einem Control verwenden kann und dann auf den Screens platzieren kann.
Es gibt ja scheinbar zwei Möglichkeiten, einmal über das Internet und CDN und einmal über webcomponents.
Idealerweise hätte ich gern für beide Lösungen ein konkretes Beispiel.

[Kamikaze]

Möglicherweise hängt das ja mit der Verrsion 1.39 zusammen.
Ich erhalte bei einer vollständig neuen Installation mit einem Screen der nur ein span element enthät in der Konsole folgende Fehlermeldung:

importmap.js:1   Failed to load resource: the server responded with a status of 404 (Not Found)
importmap.js:1   Failed to load resource: the server responded with a status of 404 (Not Found)
IobrokerHandler.js:113 ioBroker handler ready.
:8082/webui.0.widgets/importWidgetFilesRuntime.js:1   Failed to load resource: the server responded with a status of 404 (Not Found)
es-module-shims.js:1087  Uncaught (in promise) TypeError: 404 Not Found http://192.168.110.10:8082/webui.0.widgets/importWidgetFilesRuntime.js
    at doFetch (es-module-shims.js:1087:21)
    at async defaultSourceHook (es-module-shims.js:1101:15)
    at async fetchModule (es-module-shims.js:1127:10)
    at async es-module-shims.js:1206:58
    at async loadAll (es-module-shims.js:722:5)
    at async topLevelLoad (es-module-shims.js:853:5)

[Kamikaze]

Also das ursprüngliche Problem mit Chart.js konnte ich selber lösen.
Bleiben nur noch die obigen Fehlermeldungen.

[jogibear9988]

Schau den Screen "aaa" an. Ich hab eine Beispiel Komponente mit chartjs gebaut. Ich hab das als NPM Module installiert.
Per CDN denke ich geht auch, probier ich jetzt aber nicht.
Ich finde CDN doof, will ja in der Hausautomation nicht abhängig von einem CDN sein.