# Gauge Node Color fixing
**URL:** https://discourse.nodered.org/t/gauge-node-color-fixing/49410
**Category:** Dashboard
**Created:** [6 August 2021 07:25 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410 "2021-08-06T07:25:01Z")
**Posts on this page:** 17
**Page:** 1
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [6 August 2021 07:25 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/1 "2021-08-06T07:25:01Z")
How To fix a pre defined colors to gauges,
becz an industry standard the gauges must be pre defined only needle should move based on the pre setted input please help me to fix a color like below in the node red gauges
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [6 August 2021 09:39 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/2 "2021-08-06T09:39:15Z")
Hello and welcome to the forum.
I don't think you can set fixed ranges that always show to the ui\_guage. You may have to go a more custom made path.
A quick Google found at least two older but possibly still relevant resources to making a custom gauge.
> **[GitHub - e-tinkers/d3-dashboard-gauge: A node-RED inspired dashboard gauge...](https://github.com/e-tinkers/d3-dashboard-gauge)**
>
> A node-RED inspired dashboard gauge build with d3js. - GitHub - e-tinkers/d3-dashboard-gauge: A node-RED inspired dashboard gauge build with d3js.
> **[RGraph with Node-Red - Scargill's Tech Blog](https://tech.scargill.net/rgraph-with-node-red/)**
>
> Having gone from spending countless hours staring at HTML5 CANVAS, I’m now at the “meh” stage as it starts to dawn on my how it works. And so it was that I stumbled on RGraph – or put another way, Christmas for widget-lovers. If you’ve been following...
---
### Author:  [@zenofmud](https://discourse.nodered.org/u/zenofmud)
#### Post date: [6 August 2021 10:02 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/3 "2021-08-06T10:02:12Z")
You could tried [node-red-contrib-ui-artless-gauge (node) - Node-RED](https://flows.nodered.org/node/node-red-contrib-ui-artless-gauge)
---
### Author:  [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [6 August 2021 10:06 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/4 "2021-08-06T10:06:30Z")
The artless gauge does not provide visible sections colors, only the colored dots as sector indicators, which is not same.
There is many explanations why most of web gauges are not made with visual sections and only the needle showing the value. (readability issues mostly) But the truth is always somewhere in between.
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [6 August 2021 10:58 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/5 "2021-08-06T10:58:12Z")
@zenofmud i tried out this way not help me much, thanks for the support sir
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [6 August 2021 11:02 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/6 "2021-08-06T11:02:38Z")
### [GitHub - e-tinkers/d3-dashboard-gauge: A node-RED inspired dashboard gauge.](https://github.com/e-tinkers/d3-dashboard-gauge) this one may helping me but i need to show a machine temperature, as of now i am receiving data from Modbus register is it possible in the same application, if is it is solve my problem.
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [6 August 2021 20:19 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/7 "2021-08-06T20:19:08Z")
Using the RGraph method, I was able to construct this style of gauge...
```auto
[{"id":"e7e455119bceb0a5","type":"ui_template","z":"6bb0b299df732ee8","group":"926072151b8e3190","name":"Custom Gauge","order":1,"width":"8","height":"3","format":"\n\n\n\n\n\n\n\n\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":620,"y":100,"wires":[[]]},{"id":"d52f9eb356a8db51","type":"inject","z":"6bb0b299df732ee8","name":"","props":[{"p":"payload"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payloadType":"date","x":310,"y":100,"wires":[["e2c7ce49f51884e5"]]},{"id":"e2c7ce49f51884e5","type":"random","z":"6bb0b299df732ee8","name":"","low":"0","high":"40","inte":"true","property":"payload","x":460,"y":100,"wires":[["e7e455119bceb0a5"]]},{"id":"926072151b8e3190","type":"ui_group","name":"Custom Gauge","tab":"bfaf766f0535555b","order":1,"disp":true,"width":8,"collapse":false},{"id":"bfaf766f0535555b","type":"ui_tab","name":"Gauge","icon":"dashboard","disabled":false,"hidden":false}]
```
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [6 August 2021 21:09 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/8 "2021-08-06T21:09:12Z")
And tweaked a bit better for my dark theme.
```auto
[{"id":"e7e455119bceb0a5","type":"ui_template","z":"6bb0b299df732ee8","group":"926072151b8e3190","name":"Custom Gauge","order":1,"width":8,"height":3,"format":"\n\n\n\n\n\n\n\n\n\n\n\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":620,"y":100,"wires":[[]]},{"id":"d52f9eb356a8db51","type":"inject","z":"6bb0b299df732ee8","name":"","props":[{"p":"payload"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payloadType":"date","x":310,"y":100,"wires":[["e2c7ce49f51884e5"]]},{"id":"e2c7ce49f51884e5","type":"random","z":"6bb0b299df732ee8","name":"","low":"0","high":"40","inte":"true","property":"payload","x":460,"y":100,"wires":[["e7e455119bceb0a5","a775a526df1384ae"]]},{"id":"a775a526df1384ae","type":"ui_text","z":"6bb0b299df732ee8","group":"926072151b8e3190","order":2,"width":8,"height":1,"name":"Temperature","label":" ","format":"{{msg.payload}} ° C","layout":"row-center","x":610,"y":60,"wires":[]},{"id":"926072151b8e3190","type":"ui_group","name":"Custom Gauge","tab":"bfaf766f0535555b","order":1,"disp":true,"width":8,"collapse":false},{"id":"bfaf766f0535555b","type":"ui_tab","name":"Gauge","icon":"dashboard","disabled":false,"hidden":false}]
```
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [7 August 2021 05:57 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/9 "2021-08-07T05:57:07Z")
> [@Ashok](#):
>
> [GitHub - e-tinkers/d3-dashboard-gauge: A node-RED inspired dashboard gauge.](https://github.com/e-tinkers/d3-dashboard-gauge) this one may helping me
I decided to try my hand at getting this one to work for the OP... and it should look like this...
But I am not doing so well getting it to run in Node-Red Dashboard ☹ Perhaps someone can give some pointers.
As with the prior gauge example, I made a suitable subfolder folder in my `node-red-static` folder and placed the library files inside.
I then copied the contents of the `index.html` into a dashboard template and made the necessary edits to point to my RPi. I removed the links back to the git-hub source page as they are irrelevant in this case
But I can only get this result... and the text isn't even centered as it should be. What am I missing in the `template` node? I thought it was capable of running "valid HTML"?
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [9 August 2021 03:44 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/11 "2021-08-09T03:44:34Z")
@Gunner hi, same code i tried out in my PC but the gauge itself not reflecting in the dashboard.
for reference i am attached the snaps, anything required to add need to do the changes.
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [9 August 2021 04:13 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/12 "2021-08-09T04:13:41Z")
> [@Gunner](#):
>
> Using the RGraph method
> [@Gunner](#):
>
> [RGraph with Node-Red - Scargill's Tech Blog](https://tech.scargill.net/rgraph-with-node-red/)
>
> Which also references
>
> [https://tech.scargill.net/some-background/](https://tech.scargill.net/some-background/)
@Ashok Did you follow this part first?
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [9 August 2021 04:26 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/13 "2021-08-09T04:26:00Z")
yes i was tried it already, that also not working.
---
### Author:  [@Gunner](https://discourse.nodered.org/u/Gunner)
#### Post date: [9 August 2021 05:08 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/14 "2021-08-09T05:08:47Z")
> [@Ashok](#):
>
> that also not working.
What do you mean "also".. it IS the heart of that particular graphing method.
What I did was change my node-red `settings.js` ...
```auto
/** When httpAdminRoot is used to move the UI to a different root path, the
* following property can be used to identify a directory of static content
* that should be served at http://localhost:1880/.
*/
httpStatic: '/home/pi/node-red-static/',
```
Create a subfolder in my `node-red-static` folder called `RGraph` and extracted the contents of the downloaded zip file from [Get hold of the RGraph software | RGraph.net](https://www.rgraph.net/download.html#stable) into it.
It is that location of the RGraph library files which the contents of the provided flow utilizes in the embedded paths... (the `/home/pi/node-red-static/` part of the path is already implied by the changes in the `settings.js` file)
The rest of the template contents just make the graph look the way it is, and adjust based on the `msg.payload`... (and set the colour of the text in the `ui_text` node).
That library can make all sorts of interesting looking graphs based on template settings.
---
### Author:  [@jbudd](https://discourse.nodered.org/u/jbudd)
#### Post date: [9 August 2021 08:51 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/15 "2021-08-09T08:51:50Z")
Following SteveMcl's post in [https://discourse.nodered.org/t/gauge-js-library-node-red/49449](https://discourse.nodered.org/t/gauge-js-library-node-red/49449) I made this gauge:
```auto
[{"id":"5664307bd8383bfd","type":"tab","label":"Flow 4","disabled":false,"info":""},{"id":"0181a540cb556a30","type":"ui_template","z":"5664307bd8383bfd","group":"4e5fdce778c7e0ac","name":"gauge.js","order":1,"width":0,"height":0,"format":"","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":360,"y":80,"wires":[[]]},{"id":"7fd322ae44092954","type":"ui_template","z":"5664307bd8383bfd","group":"4e5fdce778c7e0ac","name":"gauge","order":2,"width":"0","height":"0","format":"\n\n\n\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":350,"y":120,"wires":[[]]},{"id":"a71899bf716e628e","type":"inject","z":"5664307bd8383bfd","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"15","crontab":"","once":true,"onceDelay":"5","topic":"set","payload":"15","payloadType":"num","x":120,"y":80,"wires":[["7fd322ae44092954","67a33629802efcd6"]]},{"id":"d68ce9c08033dc5e","type":"inject","z":"5664307bd8383bfd","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"20","crontab":"","once":true,"onceDelay":"10","topic":"set","payload":"82","payloadType":"num","x":120,"y":120,"wires":[["7fd322ae44092954","67a33629802efcd6"]]},{"id":"679930abd3f61438","type":"inject","z":"5664307bd8383bfd","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"20","crontab":"","once":true,"onceDelay":"15","topic":"set","payload":"43","payloadType":"num","x":120,"y":160,"wires":[["7fd322ae44092954","67a33629802efcd6"]]},{"id":"67a33629802efcd6","type":"ui_text","z":"5664307bd8383bfd","group":"4e5fdce778c7e0ac","order":3,"width":0,"height":0,"name":"","label":"","format":"{{msg.payload}}","layout":"col-center","x":350,"y":160,"wires":[]},{"id":"4e5fdce778c7e0ac","type":"ui_group","name":"demo","tab":"efb78c573db87f94","order":1,"disp":true,"width":"6","collapse":false},{"id":"efb78c573db87f94","type":"ui_tab","name":"Demo","icon":"dashboard","disabled":false,"hidden":false}]
```
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [9 August 2021 11:40 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/16 "2021-08-09T11:40:26Z")
@jbudd thanks for Many help.!!
---
### Author:  [@Ashok](https://discourse.nodered.org/u/Ashok)
#### Post date: [16 August 2021 09:14 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/17 "2021-08-16T09:14:59Z")
@jbudd Hi,
i tried it for single gauge, but for multiple gauges in a single window not able to display.
---
### Author:  [@system](https://discourse.nodered.org/u/system)
#### Post date: [15 September 2021 09:15 UTC](https://discourse.nodered.org/t/gauge-node-color-fixing/49410/18 "2021-09-15T09:15:37Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.