Neuer ioBroker-Blog online: Monatsrückblick März/April 2026

[Andi19851985]

Hallo Community,
ich bin vor kurzem auf den HabPanel Adapter gestoßen und finde die Visu für mich ziemlich ansprechend.
Ich überlege ob ich von der iobroker Vis zum Habpanel wechseln soll.
Habe die letzen Tage mich damit etwas beschäftigt und konnte das meiste für meine zwecke umsetzen.
Nun bin ich bei der Farbsteuerung meiner Yeelight Bulb´s angekommen und stoße an die grenze meine Fähigkeit.
Dar der Color Picker des HabPanel´s ein HSL Wert ausgibt und die Yeelight einen Hex Wert oder Hue Wert braucht
weis ich nicht wie ich es umsetzen soll.
Vielleicht kann mir einer von euch mal einen Tipp geben.
PS: Ich bin da noch ziemlich am Anfang. Bitte so einfach wie möglich formulieren .

[tim3trick]

Moin, ich hatte die Tage das gleiche Problem wie du, deswegen will ich hier mal meine Lösung beschreiben.
Zuerst habe ich einen neuen Datenpunkt angelegt (bei mir unter: "javascript.0.Helper.WohnzimmerDecke.LampeHSV"), dann ein Script gebaut das den Datenpunkt überwacht, den Wert konvertiert und in den richtigen Datenpunkt überträgt.

In Einzelschritten:

• den Adapter "Script Engine" installieren
• den Datenpunkt ("javascript.0.Helper.WohnzimmerDecke.LampeHSV" oder einen beliebigen anderen, völlig egal) anlegen
• Ein neues Script (Blockly) anlegen, ich habe es mal "livingRoomHSVWatcher" genannt, auch hier ist der Name eigentlich egal...
  Dort habe ich dann folgende Funktionalität hinterlegt:
  
• Jetzt im VIS / HabPanel den colorpicker auf den Datenpunkt "javascript.0.Helper.WohnzimmerDecke.LampeHSV" gehen lassen und fertig.

Die Erklärung ist recht trivial: Die Funktion convertHSVToHex bekommt den Wert wie er im Datenpunkt steht, d.h. wie er im ColorPicker ausgewählt wurde, konvertiert ihn in einen Hex-Wert und schreibt ihn in den Datenpunkt "xxxx.Color" der Lampe (ausserdem wird er ausgegeben, ich glaube das kann raus :D )

Wichtig ist halt, dass, wenn du meinen "Code" übernehmen willst, bei dir die Datenpunkte anpasst, spätestens mein zigbee Datenpunkt wird für dich nicht gehen ^^

Hier die exportierten Blöcke: lightConverter.xml

PS: Ich antworte, trotz Warnung wegen "veraltet" auf den Artikel, weil er das erste Suchergebnis bei Google ist, wenn man nach genau jenem Problem sucht :)

[Chris87]

@tim3trick
vielen Dank für die toller Erklärung, genau das benötige ich auch.
Leider kann ich dein Script nicht importieren, warum auch immer...

Zusätzlich müsste ich den HEX farbwert noch in dezimal umwandeln wie würdest du das machen?
Bin leider in javascript nicht wirklich fit.

Danke schon mal

MfG Chris

[Daniel_N]

@tim3trick Habe das script ausprobiert leider spuckt er bei mir immer den wert 0 für hex aus.
Der hex wert ist doch auch bloß eine von dir erstellte variable oder?
und die Js Funktion hast du auch selber so benannt?