Seite 1 von 2
Widget funktioniert nicht
Verfasst: 7. Mai 2022 15:52
von gexle
Hallo
Kann mir jemand sagen warum das Widget nicht funktioniert??
Code: Alles auswählen
uid: widget_with_chart
tags: []
props:
parameters:
- description: Title of the widget
label: Title
name: title
required: false
type: TEXT
- description: 1st gauge
label: Gauge 1 label
name: gauge1
required: false
type: TEXT
- description: 1st gauge MAX
label: Gauge 1 limit
name: gauge1max
required: false
type: TEXT
- description: 2nd gauge
label: Gauge 2 label
name: gauge2
required: false
type: TEXT
- description: 2nd gauge MAX
label: Gauge 2 limit
name: gauge2max
required: false
type: TEXT
- description: 1st chart
label: Chart label 1
name: chart1
required: false
type: TEXT
- description: 2nd chart
label: Chart label 2
name: chart2
required: false
type: TEXT
- description: Y-axis name
label: Y-axis label
name: axlabel
required: false
type: TEXT
- context: item
description: Item in gauge
label: Gauge 1 item
name: item1
required: false
type: TEXT
- context: item
description: Item in gauge
label: Gauge 2 item
name: item2
required: false
type: TEXT
- context: item
description: Item in chart
label: Chart item 1
name: item3
required: false
type: TEXT
- context: item
description: Item in chart
label: Chart item 2
name: item4
required: false
type: TEXT
parameterGroups: []
timestamp: May 7, 2022, 3:32:22 PM
component: f7-card
config:
title: Power
class:
- padding-bottom
slots:
default:
- component: f7-row
config:
class:
- margin-top
slots:
default:
- component: f7-col
config:
width: 25
class:
- display-flex
- flex-direction-column
- align-content-space-around
slots:
default:
- component: oh-gauge
config:
type: semicircle
item: StecaGridInverter_ACPower
borderColor: green
min: 0
max: 4000
valueTextColor: green
borderBgColor: gray
labelText: Generating
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: oh-gauge
config:
type: semicircle
item: calc_power_current_use
borderColor: red
min: 0
max: 4000
valueTextColor: red
borderBgColor: gray
labelText: Using
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: f7-col
config:
width: 75
slots:
default:
- component: oh-chart
config:
chartType: ""
period: 12h
label: Power
slots:
grid:
- component: oh-chart-grid
config:
containLabel: false
xAxis:
- component: oh-time-axis
config:
gridIndex: 0
yAxis:
- component: oh-value-axis
config:
gridIndex: 0
name: W
min: 0
series:
- component: oh-time-series
config:
name: Generating
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: green
item: StecaGridInverter_ACPower
- component: oh-time-series
config:
name: Using
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: red
item: calc_power_current_use
tooltip:
- component: oh-chart-tooltip
config:
confine: true
smartFormatter: true
legend:
- component: oh-chart-legend
config:
bottom: 3
type: scroll
dataZoom:
- component: oh-chart-datazoom
config:
type: inside
Es wird mir das Bild angezeigt aber wenn ich dann ein Item auswähle kommen keine Werte bzw. werden nicht dargestellt!
Danke euch
Der Yaml Code sieht so aus kann das stimmen?
Code: Alles auswählen
component: widget:widget_with_chart
config:
item: KOSTALPIKO55_DC1Voltage
item1: KOSTALPIKO55_DC1Power
item2: KOSTALPIKO55_DC2Power
item3: KOSTALPIKO55_DC1Voltage
item4: KOSTALPIKO55_DC2Voltage
title: Kostal_Piko_5.5
Re: Widget funktioniert nicht
Verfasst: 7. Mai 2022 22:52
von peter-pan
Ich weiss zwar nicht genau, um was für ein Widget es sich handelt und was man damit genau machen kann, aber ich hab es mir einfach mal geladen.
Der Yaml-Code des Widgets bei mir sieht doch schon ganz anders aus, als deiner:
Code: Alles auswählen
component: widget:widget_with_chart
config:
title: Titel
gauge1: Label 1
gauge1max: "250"
gauge2: Label 2
gauge2max: "250"
chart1: Chart 1
chart2: Chart 2
axlabel: Y-Achse
item1: Gosund_socket_01_Spannung
item2: Gosund_socket_01_Spannung
item3: Gosund_socket_01_Spannung
item4: Gosund_socket_01_Spannung
Es fehlt bei mir auch die Zeile "item:" ( bei dir -
item: KOSTALPIKO55_DC1Voltage)
Es gibt auch 2 Items, die beim Loggen als Warnung ausgegeben werden, die ich gar nicht habe, die aber im Custom-Widget-Code fest "verdrahtet" sind:
Code: Alles auswählen
2022-05-07 22:35:00.887 [WARN ] [e.internal.SseItemStatesEventBuilder] - Attempting to send a state update of an item which doesn't exist: StecaGridInverter_ACPower
2022-05-07 22:35:00.889 [WARN ] [e.internal.SseItemStatesEventBuilder] - Attempting to send a state update of an item which doesn't exist: calc_power_current_use
Ich nehme an, dass es sich dabei um irgendwelche Wechselrichter einer Photovoltaik-Anlage handelt. Leider habe ich so etwas (noch) nicht.
Deine Angaben hierzu sind halt auch etwas dürftig und vermutlich auch nicht durchgängig, wie der der Vergleich der Yaml-Codes zeigt.
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 09:34
von gexle
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 14:14
von peter-pan
Ich hab jetzt grad mal das Widget von Daniel genommen und zum Testen etwas "modifiziert", da ich keinen Inverter habe.
1. Ich habe die Parameter für den Dialog (prop1 + item) rausgenommen, da diese für das Widget gar nicht gebraucht werden.
2. Ich habe die "max" Werte von 4000 auf 100 herunter gesetzt an zwei Stellen im Widget. Das habe ich deshalb gemacht, damit man auch auf der Gauge etwas erkennen kann. (Hab grad keine so grossen "Watts"
)
3. Ich habe die Itemnamen "StecaGridInverter_ACPower" auf "Gosund_socket_05_Leistung" und "calc_power_current_use" auf "Gosund_socket_01_Leistung"
geändert. Das sind die Items der Leistungsaufnahme von zwei Schaltsteckdosen von mir.
Jetzt sieht der Code des Custom-Widget so aus:
Code: Alles auswählen
uid: widget_with_chart_Daniel
tags: []
props:
parameters: []
parameterGroups: []
timestamp: May 8, 2022, 1:33:21 PM
component: f7-card
config:
title: Power
class:
- padding-bottom
slots:
default:
- component: f7-row
config:
class:
- margin-top
slots:
default:
- component: f7-col
config:
width: 25
class:
- display-flex
- flex-direction-column
- align-content-space-around
slots:
default:
- component: oh-gauge
config:
type: semicircle
item: Gosund_socket_05_Leistung
borderColor: green
min: 0
max: 100
valueTextColor: green
borderBgColor: gray
labelText: Generating
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: oh-gauge
config:
type: semicircle
item: Gosund_socket_01_Leistung
borderColor: red
min: 0
max: 100
valueTextColor: red
borderBgColor: gray
labelText: Using
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: f7-col
config:
width: 75
slots:
default:
- component: oh-chart
config:
chartType: ""
period: 12h
label: Power
slots:
grid:
- component: oh-chart-grid
config:
containLabel: false
xAxis:
- component: oh-time-axis
config:
gridIndex: 0
yAxis:
- component: oh-value-axis
config:
gridIndex: 0
name: W
min: 0
series:
- component: oh-time-series
config:
name: Generating
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: green
item: Gosund_socket_05_Leistung
- component: oh-time-series
config:
name: Using
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: red
item: Gosund_socket_01_Leistung
tooltip:
- component: oh-chart-tooltip
config:
confine: true
smartFormatter: true
legend:
- component: oh-chart-legend
config:
bottom: 3
type: scroll
dataZoom:
- component: oh-chart-datazoom
config:
type: inside
und der Yaml-Code für das Widget ganz simpel:
Das Ergebnis sieht bei mir dann so aus:
gauge.jpg
Ich gehe mal davon aus, dass deine Itemnamen auch nicht so heissen, wie die im Custom-Widget(s.o. Punkt 3). Das musst du natürlich "hart" im Code ändern.
Das andere Custom-Widget schaue ich mir bei Gelegenheit auch mal an und gebe wieder Bescheid, wenn ich etwas dazu gefunden habe.
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 18:17
von peter-pan
So nun habe ich auch das zweite Widget mal getestet. Es funktioniert bei mir einwandfrei. Dreh- und Angelpunkt in beiden Widgets sind die Items für "Erzeugte Leistung" und für "verbrauchte Leistung". Die musst du halt zur Verfügung stellen können. Im Widget von Denis kann man halt die Angaben über den Dialog bestimmen.
Das Custom-Widget von Denis:
Code: Alles auswählen
uid: widget_with_chart_Denis
tags: []
props:
parameters:
- description: Title of the widget
label: Title
name: title
required: false
type: TEXT
- description: 1st gauge
label: Gauge 1 label
name: gauge1
required: false
type: TEXT
- description: 1st gauge MAX
label: Gauge 1 limit
name: gauge1max
required: false
type: TEXT
- description: 2nd gauge
label: Gauge 2 label
name: gauge2
required: false
type: TEXT
- description: 2nd gauge MAX
label: Gauge 2 limit
name: gauge2max
required: false
type: TEXT
- description: 1st chart
label: Chart label 1
name: chart1
required: false
type: TEXT
- description: 2nd chart
label: Chart label 2
name: chart2
required: false
type: TEXT
- description: Y-axis name
label: Y-axis label
name: axlabel
required: false
type: TEXT
- context: item
description: Item in gauge
label: Gauge 1 item
name: item1
required: false
type: TEXT
- context: item
description: Item in gauge
label: Gauge 2 item
name: item2
required: false
type: TEXT
- context: item
description: Item in chart
label: Chart item 1
name: item3
required: false
type: TEXT
- context: item
description: Item in chart
label: Chart item 2
name: item4
required: false
type: TEXT
parameterGroups: []
timestamp: May 8, 2022, 2:46:28 PM
component: f7-card
config:
title: =props.title
class:
- padding-bottom
slots:
default:
- component: f7-row
config:
class:
- margin-top
slots:
default:
- component: f7-col
config:
width: 25
class:
- display-flex
- flex-direction-column
- align-content-space-around
slots:
default:
- component: oh-gauge
config:
type: semicircle
item: =props.item1
borderColor: green
min: 0
max: =props.gauge1max
valueTextColor: green
valueFontSize: 22
borderBgColor: gray
labelText: =props.gauge1
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: oh-gauge
config:
type: semicircle
item: =props.item2
borderColor: red
min: 0
max: =props.gauge2max
valueTextColor: red
valueFontSize: 22
borderBgColor: gray
labelText: =props.gauge2
borderWidth: 25
class:
- margin-top
- margin-bottom
- component: f7-col
config:
width: 75
slots:
default:
- component: oh-chart
config:
chartType: ""
period: 12h
label: =props.chart1
slots:
grid:
- component: oh-chart-grid
config:
containLabel: false
xAxis:
- component: oh-time-axis
config:
gridIndex: 0
yAxis:
- component: oh-value-axis
config:
name: kWh
gridIndex: 0
min: 0
series:
- component: oh-time-series
config:
name: =props.chart1
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: green
item: =props.item3
- component: oh-time-series
config:
name: =props.chart2
gridIndex: 0
xAxisIndex: 0
yAxisIndex: 0
type: line
color: red
item: =props.item4
tooltip:
- component: oh-chart-tooltip
config:
confine: true
smartFormatter: true
legend:
- component: oh-chart-legend
config:
bottom: 3
type: scroll
dataZoom:
- component: oh-chart-datazoom
config:
type: inside
Der Yaml-Code des Widgets:
Code: Alles auswählen
component: widget:widget_with_chart_Denis
config:
title: Inverter Denis
gauge1: Erzeugte Leistung
gauge1max: "100"
gauge2: verbrauchte Leistung
gauge2max: "100"
chart1: Erzeugt
chart2: Verbrauch
axlabel: Watt
item1: Gosund_socket_05_Leistung
item2: Gosund_socket_01_Leistung
item3: Gosund_socket_05_Leistung
item4: Gosund_socket_01_Leistung
Screenshot:
gauge1.jpg
Eine kleine Anmerkung noch ! Ich habe bemerkt, dass beim Testen im Widget-Editor nach Eingabe der Werte (Set Props) zunächst keine Daten im Beispiel-Screen angezeigt werden. Es muss dann noch ein "Redraw" (Ctrl-R) erfolgen. ---vorausgesetzt die Eingabewerte stimmen
Aber wie gesagt zum Testen reicht allemal irgend ein bzw. zwei Number - Items .
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 18:49
von udo1toni
Sehr hübsch.
Blöd, ich finde einfach keine Zeit, mich mit dem Umstieg zu beschäftigen...
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 19:01
von peter-pan
udo1toni hat geschrieben: ↑8. Mai 2022 18:49
Blöd, ich finde einfach keine Zeit, mich mit dem Umstieg zu beschäftigen...
..es hat alles Vor- und Nachteile.
Meine Installation ist ja nicht sehr gross, aber in OH2 war alles etwas übersichtlicher und die Fehlersuche nicht ganz so aufwändig. Ausserdem gibt es doch noch das ein oder andere Problem, wie man jetzt auch beim Umstieg von M3 auf M4 gesehen hat. Was nun ein schnelles M5 nach sich gezogen hat.
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 19:16
von udo1toni
Ja
das ist aber bei openHAB2 auch mal passiert...
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 19:22
von gexle
Hallo Peter-Pan
Danke das wars mit "Redraw" jetzt läufts ich teste das ganze mal aus...Was heist den Redraw??? für was ich das den gut??
Die Farben ändern usw. werd ich dann im Code machen müssen...
Aber vom Hintergrunde also dessen Farbe ändern find ich nichts kann das den sein??
Danke
Re: Widget funktioniert nicht
Verfasst: 8. Mai 2022 19:33
von peter-pan
Im Kontext mit dem Widget-Editor, würde ich das "Redraw" als "Code mit Parametern wieder laden" interpretieren. Das brauchst du aber nur in der Testumgebung.
Wenn du das Custom-Widget gespeichert hast und es dann ganz normal auf einer Seite (Page) auswählst, dann brauchst du das nicht mehr, wie auch in meinem Screeshot zu sehen. Bei mir haben sich übrigens auch die Werte geändert, nicht so wie im englischen Forum beschrieben.