Missing nodes in @flowfuse/node-red-dashboard

[kolia]

hello,

I am currently trying to switch from the old dashboard to the @flowfuse/node-red-dashboard.

I have set up a new installation in parallel.

Button text displays, etc. are already working.

But I'm currently struggling to display a CSV (2025-08-02,3.6

2025-08-03, ...) as a monthly bar chart.

It seems that I am missing some nodes, e.g., I see “ui-chart” as installed under the palette but not on the left under the dashboard.

[rakgupta]

@kolia

I am currently trying to switch from the old dashboard to the @flowfuse/node-red-dashboard

Did you migrate your flows or are you starting new? If you migrated your old flow, the old “ui_chart” (Dashboard 1) does not translate to “ui-chart” (Dashboard 2) and you have to set it up from scratch.

If you are completely missing the chart node in the NR editor, then you may want to try reinstall the Flowfuse Dashboard. Maybe something went haywire during installation?

This is what I see on my NR:

Palette:

Node-RED Editor:

[kolia]

Thanks for your fast andere

I am starting with new flows

My view ist the same as in your Screenshots

So far should the Installation then be okay?

I just can't seem to get the new chart node to display a bar chart.

I want to display data from a CSV file with date and measured value as monthly bars.

2025-08-02,3.6

2025-08-03,4.2

2025-08-04,3.8

The file is stored local on my Raspberry.

[jbudd]

Are those three lines quoted from your CSV file?
Those seem to be daily values. Do you need to combine them to get a month per bar on the chart?

Can you confirm that you do have chart in the palette under Dashboard 2?

[rakgupta]

@kolia

just can't seem to get the new chart node to display a bar chart.

The configuration for ui-chart (DB2) is very different from the old dashboard. Here is a very basic flow plotting the data:

[{"id":"f6e233f116dc12a1","type":"inject","z":"d84b176e12749a08","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"My Data","payload":"[{\"date\":\"08-02-2025\",\"value\":3.6},{\"date\":\"08-03-202\",\"value\":4.2},{\"date\":\"08-04-202\",\"value\":3.8}]","payloadType":"json","x":702.6506652832031,"y":3493.814262574219,"wires":[["e75b92fb0a46932f"]]},{"id":"e75b92fb0a46932f","type":"ui-chart","z":"d84b176e12749a08","group":"fd6045295841c382","name":"Spreadsheet Data","label":"Spreadsheet Data","order":3,"chartType":"bar","category":"topic","categoryType":"msg","xAxisLabel":"Date","xAxisProperty":"date","xAxisPropertyType":"property","xAxisType":"category","xAxisFormat":"","xAxisFormatType":"auto","xmin":"","xmax":"","yAxisLabel":"Starts","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":"","action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":true,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#ffffff"],"textColorDefault":false,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":6,"height":8,"className":"","interpolation":"linear","x":906.1875,"y":3495.23876953125,"wires":[[]]},{"id":"fd6045295841c382","type":"ui-group","name":"db2 bar wip share","page":"ccc312f7c9d7a917","width":"30","height":1,"order":1,"showTitle":true,"className":"","visible":"true","disabled":"false","groupType":"default"},{"id":"ccc312f7c9d7a917","type":"ui-page","name":"db2 bar wip share","ui":"de5759a313e7ad79","path":"/page26","icon":" ","layout":"tabs","theme":"682b37bffc90cac5","breakpoints":[{"name":"Default","px":"0","cols":"9"},{"name":"Tablet","px":"576","cols":"9"},{"name":"Small Desktop","px":"768","cols":"9"},{"name":"Desktop","px":"1024","cols":"12"}],"order":24,"className":"","visible":"true","disabled":"false"},{"id":"de5759a313e7ad79","type":"ui-base","name":"Node-RED Dashboard DB2","path":"/dashboard","appIcon":"","includeClientData":false,"acceptsClientConfig":["ui-notification","ui-control"],"showPathInSidebar":false,"headerContent":"dashboard","navigationStyle":"fixed","titleBarStyle":"default","showReconnectNotification":true,"notificationDisplayTime":5,"showDisconnectNotification":true,"allowInstall":true},{"id":"682b37bffc90cac5","type":"ui-theme","name":"Rakesh Dark","colors":{"surface":"#097479","primary":"#337278","bgPage":"#000000","groupBg":"#000000","groupOutline":"#337278"},"sizes":{"density":"comfortable","pagePadding":"6px","groupGap":"5px","groupBorderRadius":"1px","widgetGap":"6px"}},{"id":"4c35d499a5db6512","type":"global-config","env":[],"modules":{"@flowfuse/node-red-dashboard":"1.25.0"}}]

This is what the chart looks like:

Take a look at the configuration of the chart. x-axis = date, y-axis = value. Hope this helps.

[kolia]

great, thank you, I have successfully imported it
I'll test it out