UI Gauge is Available

[joepavitt]

Hi All, just wanted to share that I've just published Node-RED Dashboard 2.0's latest release (v1.1.0) with a new widget - UI Gauge.

I know it was an incredibly popular one from Dashboard 1.0, and thanks to all for the patience in getting it out. You can see a short video recording of them in practice here

[jwj001]

Hi,i am new to Dashboard v2 how to i get it into my node-red?

[edje11]

https://dashboard.flowfuse.com/ go for the Getting started button.

[joepavitt]

You can click the menu option in the top-right of the Node-RED Editor, clixk "Manage Palette". If you've already installed a previous version, it will be listed there with an "Update to v1.1.0 button.

Otherwise, you can click the "install" tab, and then search for @flowfuse/node-red-dashboard and "Install"

[TheSaltydog]

This is the new ui-gauge, with size 1x1:

The payload value is too big vs the gauge dimension, and there is too much gap between the label and the gauge.

The same with size 2x2. Now the payload value is correctly displayed, but the gap between the labal and the gauge is still too much.

[joepavitt]

Thanks @TheSaltydog - have raised UI Gauge - Improve sizing/layout at smaller sizes (1x and 2x widths) · Issue #557 · FlowFuse/node-red-dashboard · GitHub

[Paul-Reed]

UI - Gauge
Just noticed that the limit segments cannot be re-ordered by dragging the hamburgers.
I assume that we should be able to do so?

Issue raised - UI Gauge - cannot re-order segments · Issue #558 · FlowFuse/node-red-dashboard · GitHub

[joepavitt]

Right you are Paul, thanks for raising

[hotNipi]

Took a little time and tried to investigate the layouting issue of the gauge but no luck. Too much hidden behind d3 magic probably for me.
But I didn't understand why the value field is not part of gauge but separate element thus requires special treatment in terms of layouting. Strange.

Edit:
@Paul-Reed you are so good in splitting threads - this latest gauge talk should maybe go over to the UI Gauge is Available - #4 by joepavitt thread if possibe.

Edit2:
Done! - Paul

[hotNipi]

Fancy @Paul-Reed. I can't give heart to my own post to like your edit in my post. But I'll give it for you anyway

[joepavitt]

@hotNipi

But I didn't understand why the value field is not part of gauge but separate element thus requires special treatment in terms of layouting. Strange.

Because SVG is a pain to work with for dynamic layouts given it's absolutely positioned. I try to minimise SVG as much as possible by using relatively positioned content where possible.

[RandomSporadicProjs]

Hi started playing with gauge as it was the main element stopping me beginning the move across to Dashboard 2 - thanks to all involved in making this happen.

Just to show an issue I've just noticed.

The gauge displays correctly, but when the left menu is expanded, the gauge has its right side cut off, and the pointer moves off to the left.

I guess this some sort of styling/positioning issue as discussed in this thread.

[hotNipi]

The issue is already reported

Window resize only doesn't do the trick

[RandomSporadicProjs]

So it has - things move quickly here

[Paul-Reed]

Trying to replace segmental sub-label 'text' with a mdi icon, is it possible, or confined to be text only?

[joepavitt]

Not currently, but would be a very easy feature to put in if you want to open an issue

[Paul-Reed]

Git feature issue raised Allow GAUGE segmental sub-labels to display mdi-icons · Issue #567 · FlowFuse/node-red-dashboard · GitHub

[hotNipi]

@joepavitt

easy feature

Technically easy for sure. The layout just will bite hard. Where to put it with half layout for example...

[joepavitt]

The request was in place of the units label, so a starting point, if mdi is detected at the start of the unit property, I'll show an icon instead