Axis Font Size on Barchart


I have attempted to search but I can not seem to find the field for style sheet to change the font on the x and y axis for the legends.

I attempted to examine the Elements but it appears to use a canvas element to make the chart:

<canvas ng-if="me.item.look==='bar'" 
class="chart chart-bar ng-scope ng-isolate-scope" 
chart-colors="config.colours" height="383" width="1370" style="display: block; width: 1713px; height: 479px;"> </canvas>

I found where to change the title of the chart

.nr-dashboard-theme .nr-dashboard-chart-titlel {  font-size: xx-large;
  font-weight: 500 !important;

I am just at a loss of where to change the text size of the axis options.

Kind Regards,


The answer will take the same path as this thread Values color - gauge


I really appreciate the help.

I can not see the fields that would be applicable in that document to label/ value font size. I tried injecting the following into my node : "ui_control":{"options":{"labelMinFontSize":100}}} without any luck.


I tried to use this but it was from gauge documentation and not the chart documentation. Could you point me to the chart documentation with options.

Kind Regards,


Apologies (was late at night) - I mixed up gauge and chart in my head.
I'm sure there will be an option , but I don't think we currently expose it.


Have added the ability to override many more of the chartjs options to master branch (not yet on npm).

So this should now work... when sent to a chart widget

[{"id":"b7667d24.e8999","type":"function","z":"f86be7c2.1183b8","name":"","func":"\nmsg.ui_control = { options: {\n    scales: {\n     yAxes: [\n      {\n          display: true,\n          ticks: {\n            fontSize: msg.payload,\n            fontColor: \"red\"\n          }\n      }\n    ]\n  }\n}\n}\nmsg.payload = 10;\nmsg.topic = \"test\";\nreturn msg;","outputs":1,"noerr":0,"x":730,"y":440,"wires":[["1ca3d373.1d0d4d"]]},{"id":"4edff357.f0102c","type":"ui_button","z":"f86be7c2.1183b8","name":"","group":"81133bb4.a310a8","order":1,"width":0,"height":0,"passthru":false,"label":"font 8","tooltip":"","color":"","bgcolor":"","icon":"fa-building-o","payload":"8","payloadType":"num","topic":"","x":570,"y":440,"wires":[["b7667d24.e8999"]]},{"id":"f2767e11.7f7ff","type":"ui_button","z":"f86be7c2.1183b8","name":"","group":"81133bb4.a310a8","order":1,"width":0,"height":0,"passthru":false,"label":"font 40","tooltip":"","color":"","bgcolor":"","icon":"fa-building-o","payload":"40","payloadType":"num","topic":"","x":580,"y":480,"wires":[["b7667d24.e8999"]]},{"id":"81133bb4.a310a8","type":"ui_group","name":"Group 1","tab":"c079e407.819378","order":1,"disp":true,"width":6},{"id":"c079e407.819378","type":"ui_tab","name":"Tab 2","icon":"dashboard","order":2}]


When will this make it to npm? I do not want to show my ignorance on how to install from github. I tried just copying into the the chart.js file but that did not work.

Kind Regards,


you can install from master

cd ~/.node-red && npm i node-red/node-red-dashboard


Hi, I did the upgrade to 2.14.1 and tried out your example, but there was no change to the font size, any ideas?