Node-Red charts are not displayed

Dashboard
1

Hi,
I wanted to get into touch with Node-Red by implementing the following project: https://randomnerdtutorials.com/esp32-mqtt-publish-subscribe-arduino-ide/
In the end I was not able to get the chart to show temperature over time running, it does not display anything at that position. As far as I can tell the error messages in browser console also does not belong to charts:

image
image1647Ă—627 63.5 KB

image
image1340Ă—362 39.5 KB

I have no idea whats wrong with my implementation, data is available and changing msg.payloud to numbers also doesn't change anything.
I would be thankful for any support/ idea to solve this issue.
Current installation:
Node-Red version 1.2.5

Node: v14.15.1
Nodejs: v10.23.0

Thanks in advance,
Fil

2

Welcome to the forum @lfil

Please select the four lower nodes and Export them to the clipboard then paste them here using the </> button at the top of the forum text window when pasting it in.

3

@Colin thanks for welcoming. I'm not sure what the "lower nodes" are, therfore I exported all of them. I hope this helps?

Thanks.

[{"id":"abf7079a.653be8","type":"mqtt in","z":"a39bb7f1.bc8788","name":"","topic":"esp32/temperature","qos":"2","datatype":"auto","broker":"10e78a89.5b4fd5","x":344,"y":327,"wires":[["cc79021b.9a751","21eae8f8.2971b8","8356a104.2e64b"]]},{"id":"cc79021b.9a751","type":"debug","z":"a39bb7f1.bc8788","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":541,"y":294,"wires":[]},{"id":"4aecba01.78ce64","type":"mqtt in","z":"a39bb7f1.bc8788","name":"","topic":"esp32/humidity","qos":"2","datatype":"auto","broker":"10e78a89.5b4fd5","x":333,"y":211,"wires":[["22efa7b7.544a28","df37e6b7.64c1c8"]]},{"id":"22efa7b7.544a28","type":"debug","z":"a39bb7f1.bc8788","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":530,"y":178,"wires":[]},{"id":"21eae8f8.2971b8","type":"ui_chart","z":"a39bb7f1.bc8788","name":"","group":"61285987.c20328","order":0,"width":0,"height":0,"label":"Temperature","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":true,"ymin":"","ymax":"","removeOlder":1,"removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"x":541,"y":354,"wires":[[]]},{"id":"df37e6b7.64c1c8","type":"ui_gauge","z":"a39bb7f1.bc8788","name":"","group":"61285987.c20328","order":0,"width":0,"height":0,"gtype":"gage","title":"Humidity","label":"%","format":"{{value}}","min":0,"max":"100","colors":["#00b3d9","#0073e6","#001bd7"],"seg1":"33","seg2":"66","x":520,"y":238,"wires":[]},{"id":"8356a104.2e64b","type":"ui_gauge","z":"a39bb7f1.bc8788","name":"","group":"61285987.c20328","order":0,"width":0,"height":0,"gtype":"gage","title":"Temperature","label":"°C","format":"{{value}}","min":0,"max":"100","colors":["#007cdb","#e6d600","#d64000"],"seg1":"20","seg2":"22","x":550,"y":400,"wires":[]},{"id":"10e78a89.5b4fd5","type":"mqtt-broker","name":"","broker":"localhost","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""},{"id":"61285987.c20328","type":"ui_group","name":"Main","tab":"e7c46d5e.a1283","order":1,"disp":true,"width":"6","collapse":false},{"id":"e7c46d5e.a1283","type":"ui_tab","name":"Dashboard","icon":"dashboard"}]
5

That looks ok, does the temperature gauge work?

Are you using the latest version of node-red-dashboard? Check in Manage Palette. If not try updating it, clear the browser cache and refresh the page.

If still not fixed then what browser are you using? Can you try a different one?

Please stop node-red and start it again in a terminal and copy/paste the output here, that will show us a lot.

If you replace the temperature MQTT node with a couple of injects like this does it work?
image

Here are the inject nodes so you can Import them.

[{"id":"e81c76b9.011a4","type":"inject","z":"bdd7be38.d3b55","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"esp32/temperature","payload":"16.4","payloadType":"str","x":140,"y":3260,"wires":[["cc79021b.9a751","21eae8f8.2971b8","8356a104.2e64b"]]},{"id":"94f3566d.7039d","type":"inject","z":"bdd7be38.d3b55","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"esp32/temperature","payload":"20.0","payloadType":"str","x":140,"y":3320,"wires":[["cc79021b.9a751","21eae8f8.2971b8","8356a104.2e64b"]]}]

By lower four nodes I meant just the four associated with temperature, since the humidity part is working as it should.

Finally, are those the only dashboard nodes you have configured (the two gauges and the chart)? If so remove them, Deploy, restart node-red and add them again please.

6

Yes the temperature gauge works fine. I already tested it with CHrome, Firefox and Safari, as well as restarted Node-Red several times with and without changes.

I also replaced the temperature MQTT with your import suggestion and nothung changed.

I asume that there are any packages or settings at my raspberry pi which do not allow to use chart, what services and packages are needed tfor chart to work?

Thanks for explanation for "lower notes". :slight_smile:

As requested I restarted the Node-Red and got following messages:
Start Node-RED

Once Node-RED has started, point a browser at http...:1880
On Pi Node-RED works better with the Firefox or Chrome browser

Use node-red-stop to stop Node-RED
Use node-red-start to start Node-RED again
Use node-red-log to view the recent log output
Use sudo systemctl enable nodered.service to autostart Node-RED at every boot
Use sudo systemctl disable nodered.service to disable autostart on boot

To find more nodes and example flows - go to http://flows.nodered.org

Starting as a systemd service.
22 Nov 18:40:45 - [info]
Welcome to Node-RED
===================
22 Nov 18:40:45 - [info] Node-RED version: v1.2.5
22 Nov 18:40:45 - [info] Node.js version: v14.15.1
22 Nov 18:40:45 - [info] Linux 5.4.72-v7l+ arm LE
22 Nov 18:40:46 - [info] Loading palette nodes
22 Nov 18:40:47 - [info] Dashboard version 2.24.1-beta started at /ui
22 Nov 18:40:47 - [info] Settings file : /home/pi/.node-red/settings.js
22 Nov 18:40:47 - [info] Context store : 'default' [module=memory]
22 Nov 18:40:47 - [info] User directory : /home/pi/.node-red
22 Nov 18:40:47 - [warn] Projects disabled : editorTheme.projects.enabled=false
22 Nov 18:40:48 - [info] Flows file : /home/pi/.node-red/flows_Homeverzeichn is.json
22 Nov 18:40:48 - [warn]
---------------------------------------------------------------------
Your flow credentials file is encrypted using a system-generated key.
If the system-generated key is lost for any reason, your credentials
file will not be recoverable, you will have to delete it and re-enter
your credentials.
You should set your own key using the 'credentialSecret' option in
your settings file. Node-RED will then re-encrypt your credentials
file using your chosen key the next time you deploy a change.
---------------------------------------------------------------------
22 Nov 18:40:48 - [info] Starting flows
22 Nov 18:40:48 - [info] Started flows
22 Nov 18:40:48 - [info] Server now running at http:...
22 Nov 18:40:48 - [info] [mqtt-broker:10e78a89.5b4fd5] Connected to broker: mqtt

7

You are using a Beta version of the dashboard, though I don't know if that is significant. Is there a reason you are doing that? If not then restore the released version by running
cd ~/.node-red
npm remove node-red-dashboard
npm install node-red-dashboard
then restart node-red. If that still doesn't fix it then try my suggestion from my last post: "Finally, are those the only dashboard nodes you have configured (the two gauges and the chart)? If so remove them, Deploy, restart node-red and add them again please."

1 Like
8

Thanks a lot for your support. I installed node-red-dashboard 2.24.0 and started again from scratch and it seems to work, now. Thanks.

9

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.