Hi,
I'm using some template as a gauge. I changed the text color but I need to change the values color. 
regards,
Does this help ?
Not to much! 
Most of gauge elements have inline styles so overriding is not an option here. Sadly.
Really. The justgage options expose valueFontColor
To change gauge options with msg
msg = {payload:25,ui_control:{options:{valueFontColor:"#00ff00"}}}
return msg;
1 Like
It's doesn't work 
Share your flow.
[{"id":"a1686925.d3c5a8","type":"tab","label":"Flow 1","disabled":false,"info":""},{"id":"7f5513d2.af4a1c","type":"ui_template","z":"a1686925.d3c5a8","group":"d30fde8b.f7dc7","name":"Mesures","order":0,"width":"6","height":"40","format":"\n #CabaneDeGardian_Mesures,\n #CabaneDeGardian_Mesures md-card {\n background : rgba(205,205,205,0);\n border: rgba(205,205,205,0);\n height: 200px; \n font-size: 25px;\n color: lime;\n position: center;\n }\n\n\n\n\n\n\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":900,"y":340,"wires":[]},{"id":"b6d28dfd.a4b6","type":"ui_gauge","z":"a1686925.d3c5a8","name":"CO2","group":"d30fde8b.f7dc7","order":5,"width":0,"height":0,"gtype":"gage","title":"CO2","label":"ppm","format":"{{msg.payload}}","min":"350","max":"40000","colors":["#00b500","#e6e600","#ca3838"],"seg1":"1000","seg2":"2000","x":1010,"y":400,"wires":},{"id":"bb0b50e5.5e48f","type":"function","z":"a1686925.d3c5a8","name":"","func":"var buf = Buffer.from(msg.payload);\nvar s = buf.readUInt8() >> 7 === 0 ? 0 : 2048;\nvar m = (buf.readUInt16BE() & 0b0000011111111111) - s;\nvar e = (buf.readUInt8() & 0b01111000) >> 3;\nmsg.payload = 0.01 * m * Math.pow(2, e);\nmsg.payload = msg.payload.toFixed(1);\nreturn msg","outputs":1,"noerr":0,"x":770,"y":400,"wires":[["b6d28dfd.a4b6"]]},{"id":"96e22936.e103a8","type":"change","z":"a1686925.d3c5a8","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.value","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":540,"y":400,"wires":[["bb0b50e5.5e48f"]]},{"id":"17967275.e6a46e","type":"switch","z":"a1686925.d3c5a8","name":"CO2","property":"payload.dstgad","propertyType":"msg","rules":[{"t":"eq","v":"6/6/2","vt":"str"}],"checkall":"true","repair":false,"outputs":1,"x":310,"y":400,"wires":[["96e22936.e103a8"]]},{"id":"d30fde8b.f7dc7","type":"ui_group","z":"","name":"Mesures","tab":"4f409648.8d9438","order":6,"disp":false,"width":"6","collapse":false},{"id":"4f409648.8d9438","type":"ui_tab","z":"","name":"CabaneDeGardian","icon":"home","order":1}]
Unfortunately your flow isn’t currently importable.Please read the following post How to share code or flow json and then edit the above message.
[{"id":"6aad5549.ea5dec","type":"tab","label":"Flow 1","disabled":false,"info":""},{"id":"936f2449.6e5f18","type":"ui_template","z":"6aad5549.ea5dec","group":"d30fde8b.f7dc7","name":"Mesures","order":0,"width":"6","height":"40","format":"<style>\n #CabaneDeGardian_Mesures,\n #CabaneDeGardian_Mesures md-card {\n background : rgba(205,205,205,0);\n border: rgba(205,205,205,0);\n height: 200px; \n font-size: 25px;\n color: lime;\n position: center;\n }\n\n</style>\n\n\n\n\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":900,"y":340,"wires":[[]]},{"id":"ade47aa8.9f0a58","type":"ui_gauge","z":"6aad5549.ea5dec","name":"CO2","group":"d30fde8b.f7dc7","order":5,"width":0,"height":0,"gtype":"gage","title":"CO2","label":"ppm","format":"{{msg.payload}}","min":"350","max":"40000","colors":["#00b500","#e6e600","#ca3838"],"seg1":"1000","seg2":"2000","x":1010,"y":400,"wires":[]},{"id":"85c3fd77.0bb5f","type":"function","z":"6aad5549.ea5dec","name":"","func":"var buf = Buffer.from(msg.payload);\nvar s = buf.readUInt8() >> 7 === 0 ? 0 : 2048;\nvar m = (buf.readUInt16BE() & 0b0000011111111111) - s;\nvar e = (buf.readUInt8() & 0b01111000) >> 3;\nmsg.payload = 0.01 * m * Math.pow(2, e);\nmsg.payload = msg.payload.toFixed(1);\nreturn msg","outputs":1,"noerr":0,"x":770,"y":400,"wires":[["ade47aa8.9f0a58"]]},{"id":"d30fde8b.f7dc7","type":"ui_group","z":"","name":"Mesures","tab":"4f409648.8d9438","order":6,"disp":false,"width":"6","collapse":false},{"id":"4f409648.8d9438","type":"ui_tab","z":"","name":"CabaneDeGardian","icon":"home","order":1}]
I don't see that you are trying to use the option I suggested
like this?
[{"id":"feba725a.782358","type":"function","z":"6aad5549.ea5dec","name":"","func":"msg = {payload:25,ui_control:{options:{valueFontColor:\"#00ff00\"}}} \nreturn msg;","outputs":1,"noerr":0,"x":770,"y":440,"wires":[["ade47aa8.9f0a58"]]}]
True. It does not work for Node-RED theme, but works with Angular theme. Weird.
Sorry for bringing this topic back up again.
My Node Red stats 1.0.5, node,js 12.16.2 npm 6.14.4 : Windows 10
Using the Dark Theme dashboard
But has anyone found a solution to this problem? To change the font color of the value in a gauge... circled in red below
I tried to change it using change node set as shown below... but no dice...
my flow looks like this
[{"id":"77eb42c6.23338c","type":"ui_ui_control","z":"e01199f.ec54c68","name":"","x":1000,"y":1940,"wires":[["a9dbd5ef.9fb0d8"]]},{"id":"a9dbd5ef.9fb0d8","type":"delay","z":"e01199f.ec54c68","name":"","pauseType":"delay","timeout":"40","timeoutUnits":"milliseconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":1150,"y":1940,"wires":[["bcfd12fe.95b6"]]},{"id":"bcfd12fe.95b6","type":"change","z":"e01199f.ec54c68","name":"","rules":[{"t":"set","p":"ui_control.options.minLabelMinFontSize","pt":"msg","to":"16","tot":"num"},{"t":"set","p":"ui_control.options.maxLabelMinFontSize","pt":"msg","to":"16","tot":"num"},{"t":"set","p":"ui_control.options.valueMinFontSize","pt":"msg","to":"24","tot":"str"},{"t":"set","p":"ui_control.options.valueFontColor","pt":"msg","to":"#32cd32","tot":"str"},{"t":"set","p":"ui_control.options.labelMinFontSize","pt":"msg","to":"16","tot":"str"},{"t":"delete","p":"payload","pt":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":1320,"y":1940,"wires":[["e2822e5c.111f6"]]},{"id":"e2822e5c.111f6","type":"ui_gauge","z":"e01199f.ec54c68","name":"HP Steam from Refinery","group":"c03ae725.373378","order":4,"width":5,"height":3,"gtype":"gage","title":"<center><b><i><font size=\"4\" color=\"gold\">{{msg.payload.Tag}}</font></i></b></center>","label":"tph","format":"{{msg.payload.Value}}","min":0,"max":"100","colors":["#00b500","#e6e600","#ca3838"],"seg1":"33","seg2":"66","x":1550,"y":1940,"wires":[]},{"id":"94aed295.a7a6a","type":"function","z":"e01199f.ec54c68","name":"Set GET and request Value","func":"var tag = msg.payload;\n\nvar PIAF_Tag_flowname_pair = flow.get(\"PIAF_TAG_flowname_pair\");\nvar retObj = PIAF_Tag_flowname_pair.filter(function(i) {\n return i.PIAF_Tag === tag;\n});\n\nmsg.payload = {\"Tag\":tag,\"Value\":flow.get(retObj[0].flowname).Value, \"Date\":flow.get(retObj[0].flowname).date, \"Time\":flow.get(retObj[0].flowname).time};\n\nreturn msg;","outputs":1,"noerr":0,"x":1280,"y":1900,"wires":[["25d6ab8e.00be04","e2822e5c.111f6","fb7f64.05c210a","bacbe340.117ea"]]},{"id":"c03ae725.373378","type":"ui_group","z":"","name":"OUTPUT","tab":"152d2da.753f2d2","order":3,"disp":true,"width":"20","collapse":false},{"id":"152d2da.753f2d2","type":"ui_tab","z":"","name":"High Pressure Steam Balance","icon":"dashboard","disabled":false,"hidden":false}]
Any feedback on this is much appreciated.
If you choose Node-RED theme everywhere, you can't use this option. Colors for value, unit and min/max depend on
.nr-dashboard-theme .nr-dashboard-gauge text {
fill: #eeeeee;
margin: 8px;
}
With Angular theme justgauge options can still be adjusted.
This may be design decision or may be here just by mistake.
Probably @dceejay has something to say about it.
How do I enable angular Theme in Node Red?
Thanks for sharing hotNipi
Yes we set it as part of the theme so the text matches across the whole dashboard. Not sure if you could override with !important. I’ve not tried it.
