Gauge's for Dashboard 2.0 made with ui_template

I wonder why no one has still asked for a vertical one !
It is a beautiful guage, is almost identical to the one we have at factory that we use to measure CO2 GV in beverages procesing line although, that is vertical.

Photo maybe possible? It may give some ideas for better design...

Vertical is a bit tricky. Many compromise decisions needed to make to balance out responsiveness and readability.

Could you make a curved one?
like on the TS-990 Frequency dial?

Most probably I can yes.
Tried to put it in my schedule. With heavy shaking it fits nicely into summer 2027

12 Likes

EDIT : Forget it, seems to work like a charm !

Hi,

thanks for sharing, that one looks great !

Quick question, I did not test it yet, can it accommodate negative input values ? Example if I want a range from -60 to +10 ....

Thanks !

@Giamma … did you ever publish the code for the version of the compass in this post (including color of wind speed)?

All of the gauges here were created by the inimitable Mr @hotNipi - including the compass (see post #2)

@Steve-Mcl … thanks for correct my misunderstanding & my complements to @hotNipi for a great compass design

@hotNipi … I’m an extreme novice when it comes to CSS. By chance do you have the html/code to post which created the compass in post #64?

@k5map in case you didnt notice:

1 Like

I found the code in post #2 but when I use it, it does not look like the compass in post #64. The center parts are different (text, color wind speed, etc)

The original CSS has been modified to suit the user in #64. Check classes .txt & .txt .small

Ok that makes sense… when I first started down this path to find a compass, wasn’t expecting to ramp up my CSS knowledge (which was near zero) :slight_smile:

Hi all, sorry to sound dense but how do you get these to work? I've just started using Dashboard 2, and I've been out of the node red scene for a bit. do i just use one template. As before thanks @hotNipi for doing this, i was going to use the older one that were done before but thought id upgrade. if someone cold post a basic flow please so i can look and learn. Thanks in advance!

Which gauge[s] do you wish to create? Maybe show us a screenshot of your dashboard 1.

Not got the old one available, the first one on this page would be helpful

It isn't clear which one you mean, can you post a screenshot of the one you want?


this one , or to be honest any that can get me started please

Did you take the code and put it in a template node?

There more different gauges in posts #2 and #5 - perhaps more (scroll down from the top).

1 Like

ok now ive got it, my dashboard wasnt displaying anything. Reset it and they came up first one needed to be set up for the type. Thanks , new it was me!

I have a dashboard that is functioning, and I'd like to experiment with these gauges. I could use a little guidance to get one (any) up and running and have a couple questions:

  1. I assume the template code gets pasted into the template window of a template node (I do understand setting the type and UI). Do I replace the default template text entirely?

  2. What do I do with the CSS code?

A couple steps for a newbie would be great, or point me where to look. Google hasn't turned up what I am looking for to make this work.