Custom widget: Gauge

Hi Yannick,

I’m dying to get this gauge widget onto my UI. It’s super-cool.

I cannot seem to find it though.

I have updated downloaded the widget .jar and the latest HABpanel .jar into the addons folder:

And my widget dropdown looks like this…

Any idea why it doesn’t show up?

Thanks in advance,


@UglyKidJoe can you verify the following:

  • In the openHAB console, type bundle:list, you should see a line like this:
189 | Active   |  80 |     | Gauge widget for HABPanel
  • In Paper UI, go to Configuration > Services > UI (tab) > Configure HABPanel > Expert mode - post a screenshot of that screen. Maybe you simply have no HABPanel configuration yet, in this case the bundle would not install the widget.

Hi @ysc,

Thank’s for your reply.

For me typing bundle:list at the prompt failed with the following:

Is there a component I am missing maybe?

I’m running on an OpenHABian installed instance.

The HABPanel configuration Under PaperUI configuration>services>UI expert mode looks like this…

Thanks gain,


Hi Craig,

I think you should go to the karaf-console first.

Install karaf with openhabian

sudo openhabian-config

Details see

Then call the karaf-console with

ssh openhab@localhost -p 8101

Then in karaf-console you can type:


Hi @anfaenger,

Thanks for the pointer :slight_smile:

I was now able to run the bundle:list, though I didn’t find the “Gauge widget for HABPanel” entry as Yannick referred to above.

Here is the tail of it…

I have no experience with the new bundle-oriented widget installation.

I did a first try, but when I tried to copy the jar-file into the addons-directory I ended up with a “permission denied”-error.

I’m sorry, at the moment I can’t help you.

@UglyKidJoe I assumed you were running openHAB on Windows since you posted a Windows Explorer screenshot…?

Anyways, on openHABian the addons folder should be /usr/share/openhab2/addons (documentation) - that’s where you should copy the bundle’s .jar file.

But your second screenshot also tells your HABPanel configuration is empty. So before you copy the .jar into the addons folder (or remove it if it’s already there), go to your HABPanel’s advanced settings and click the “Save the current configuration to a new panel configuration” link and give it a name. This will create the config. Then copy the .jar file.

Thanks Yannick. God spot on the windows installation! I only use that to test things when I’m away from home, so the schoolboy error was that I put the .jar in the windows installation and not my Pi. :blush:

Now it’s all good. Cheers

1 Like

It works for me but only after creating new panel AND restarting gauge bundle. Thanks @ysc

is there a new version that works with OH 2.1 and newer?

I also have the same question, the widget loads but is not visible in habpanel

 9 | Active   |  80 |     | Gauge widget for HABPanel

I seem to have solved the problem. If anyone else is having the same issue my problem was that I still had an older habpanel .jar file in my addon folder. I removed this and then reinstalled habpanel in the paper UI and now all is working properly :slight_smile:

Hi guys,
independently of the fact that this topic is quite old I try to get this addon working.
It seems that I have the same issue like others: The add-on is loaded and active (I see it in the OH console) but the widget is not available in HABpanel.
Would be great if someone who got it working provide some addional hints for me.


Hi Yannick,

Many thanks for this great work! For beginners it’s really not easy to let it run, but now it works fine:


I have a question to the colors: Is it possible to change it? For example yellow to blue?

Hi, sorry for the delay, I just happen to find this in a suggested topics list.
IIRC I made a “clone widget” feature in HABPanel’s custom widgets list (in the original gauge widget tile’s context menu) which will copy it to a regular custom widget that you can edit. Then you should find hardcoded values for the colors in the code.

Hi Yannick,
Many thanks for your reply. I’ve cloned the widget as you described. But I’ve only see this code without hard coded colors:

I hope, you can help me to find the right way to customize the widget.
Many thanks in advance and best regards

Revisiting this code it appears the default colors are defined here, in the directive’s JS file:

What you can do, to keep things simple, is save the file above (click on the Raw button on GitHub) in the html folder of your configuration (maybe in a gauge subfolder), modify it as you see fit, then modify the code of the widget in HABPanel changing
oc-lazy-load="['/habpanel-resources/gauge/gauge.directive.js']" to

1 Like

Hi Yannick,
Many thanks for your reply. I’ll try it next weekend!
Kind regards

Hi Yannick,

I’ve tyed it as you described in this path:

And change it in the widget-clone too:


But with no effect.

It would be great, if you give me a solution for this!

Best regards

Looks ok, what do you mean by “no effect”?
Did you change the source? Try adding console.log('hello') somewhere to confirm the right file is being loaded, check the console in the developers tools of your browser.