Custom Widget - ThermoKnob

This widget is a thermostat inspired by the standard knob widget. It can display the current sensor temperature with the temperature set point, as well as the current heating state.


Widget: habpanel-thermoknob-widget (github)

The appearance can be configured:

  • Set point bar color
  • Scale (min,max,step)

What’s new:

  • 2021-10-24 : added read-only option in widget configuration

It works and looks nice, thank you @blobule and welcome!

Thanks for this widget! Works great for me… Had to play around a little bit to adjust the colours and scale, but worked out great in the end! Thanks for you effort.

Nice Widget!
For my heating, scale would be good between 18 and 24 Celsius, but after editing min and max in ng-knob-thermo.js the design was broken. Is there any documentation?

I had the same problem… You also need to add the min/max and quanity (in scale section) in control-oh.js. Quantity are the number of intervals, e.g. i’ve adjusted my min/max to 18-23, with step of 0.5… giving me a quantity of 11

Thanks, I found these settings and changed the values.
The widget is working, but every time the page is called or refreshed, it shows “14 °” which I found to be
scope.value = scope.value || 14;
in ng-knob-thermo.js
Is that some kind of a default value?
And the orange ring is messed up : )

Hi @migal and @Sjaakios, I just updated the widget with scale and color parameters.

Hopefully it works for you,

1 Like

Thank you @blobule for your quick answer!
I tried the new version and now it is very easy to customize it.

My refresh problem didnt disappear, Im afraid:
The first and second screenshot shows how data is changed when operating your widget.
The third screenshot shows status after refreshing the panel.
Do you have any idea why this happens?

14C is a default value when no update has been sent to the widget.
Solved by getting the widget to pull item values on initialization, and not wait for an update.
Seems to solve the issue. I’ve updated the gitlab repository.

Note that I still get this problem during editing in habpanel. However, it you visit another panel then come back, the widget is always displayed correctly.

If you still get 14C in normal operation (not editing), maybe the setpoint item is not correctly configured for that widget? or its a habpanel / angular issue?

I did some testing now: if the Minimum value is set to 14 or below, everything works. I set Max value to different values and also Step value to 0.5, everything ok.

If Min value is set to 15 and above, the 14C default comes up if page is loaded or refreshed. The widget can be operated then, showing correct values, but reloading results in default value 14.
It also doesnt take values from other widgets, eg another slider with the same item, which it does if set to Min Value 14 or below.

There was a bug… refusing to update to a new setpoint value if the current value is outside the min…max range. Fixed. I hope this works!

It works now, all values are updating and ranges can be set. I am going to try your widget in my visu, so thanks again!

One suggestion, if you set steps to 0.5, the font size for the setpoint value is a little too big, so a parameter for font style/size would be good.

Font is now auto-adjusted when step is <1. Added a few minor fixes to display of numbers. Repo updated.

Font looks good now.

I found another issue about updating the heating status. If the page is loaded or even changed from another page within habpanel, every status is “not heating”. after a refresh or after changing temperature the status is correctly updated. changing the page and then coming back to the heating page results in “not heating” again. I dont think this is an problem with my items, because default sliders work normal.

OpenHAB meldet beim hinzufügen des Widgets:
Keine Widgets gefunden (*.widget.json Dateien)! Bitte melde das.

Habe ich hiermit gemacht. :wink:

No, you did not. English please!

This is a fantastic widget, thank you!

How did you develop it? I’d like to start working on some widgets but I don’t know what dev tools/IDE can be used.

Sorry :wink:

When i try to add this Widget to OpenHAB i get this ErrorMessage:

No Widgets found (*.widget.json Files)! Please report that.

Maybe you could fix that.

Thank you,


i’ve struggling with this Widget, because it’s empty.

I think it’s a problem with the static html-path ,but i didn’t find the place where OpenHAB is expecting this files.

My environment:
Debian Buster
OpenHAB installed via apt-get
Widget added via HABPanel -> add Widget -> gear -> add Widget -> import from file

Thank you for your help!

I cannot fix it.
Please explain more detailed, how you tried to import the widget.