Dashboard charts break after refresh (X axis scales up 5 hrs+)

Dashboard
1

Hello all, I am new to node red as of 2 weeks ago, so Im sure theres something simple im missing here. I have a Raspberry pi zero W, with a neopixel stick and an adafruit BME680. I have used several different guides to build this dashboard.

My main issue im having is that the line charts work completely fine until after the browser refreshes the page. After the refresh, the time scale changes and adds several hours to the x axis. The issue can be solved by either deleting the chart and adding a new one or rebooting the device, however when the page refreshes, the same thing occurs. Im baffled by this.

working_1
working_1750Ă—687 31.6 KB

^Here you can see the chart is working perfectly fine

broken1
broken1691Ă—1050 35.8 KB

^Here you can see that the page has been refreshed, the data points are still there, however the x axis has for some reason added 9 hours, although the chart is only set to view the last 1 hour.

you also might notice that the other charts are having the same issue although the value is the same after each poll.

In the screenshots, you might notice that VOC is currently the only working data coming from the sensor, This is because I got some hot glue in the sensor port and it has ruined most of it.

Any input would be greatly appreciated. you can find my flow here:

[{"id":"d551e5.6a5cfe18","type":"tab","label":"BME680","disabled":false,"info":""},{"id":"2a49f37b.3cc24c","type":"group","z":"d551e5.6a5cfe18","style":{"stroke":"#999999","stroke-opacity":"1","fill":"none","fill-opacity":"1","label":true,"label-position":"nw","color":"#a4a4a4"},"nodes":["bbe40d5a.9fa9e","b77fa80c.11ed38"],"x":1254,"y":219,"w":232,"h":142},{"id":"4da19e82.5ebb2","type":"group","z":"d551e5.6a5cfe18","style":{"stroke":"#999999","stroke-opacity":"1","fill":"none","fill-opacity":"1","label":true,"label-position":"nw","color":"#a4a4a4"},"nodes":["5b7698f6.faafc8","5fd30172.4d4c58","9d6fbcc2.49f4b8"],"x":1234,"y":579,"w":252,"h":162},{"id":"b0696838.676458","type":"group","z":"d551e5.6a5cfe18","style":{"stroke":"#999999","stroke-opacity":"1","fill":"none","fill-opacity":"1","label":true,"label-position":"nw","color":"#a4a4a4"},"nodes":["e3e148eb.6c59d","f7a4502f.f25b58","b3022fd7.ba64f8"],"x":1234,"y":39,"w":312,"h":162},{"id":"c4a3f0fe.2d866","type":"group","z":"d551e5.6a5cfe18","style":{"stroke":"#999999","stroke-opacity":"1","fill":"none","fill-opacity":"1","label":true,"label-position":"nw","color":"#a4a4a4"},"nodes":["8c364894.a362a8","85b65f56.e570b","a1e5062c.50b028","e4934e73.c49b8"],"x":1234,"y":379,"w":232,"h":182},{"id":"a1e5062c.50b028","type":"ui_chart","z":"d551e5.6a5cfe18","g":"c4a3f0fe.2d866","name":"","group":"ff8a4ab5.f3ed5","order":0,"width":"10","height":"4","label":"chart","chartType":"line","legend":"false","xformat":"dd HH:mm","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":1,"removeOlderPoints":"500","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":1330,"y":440,"wires":[[]]},{"id":"ff8a4ab5.f3ed5","type":"ui_group","name":"VOC (Ohms)","tab":"6c90afc.b3623d","order":3,"disp":true,"width":"15","collapse":false},{"id":"6c90afc.b3623d","type":"ui_tab","name":"BME680","icon":"dashboard","order":2,"disabled":false,"hidden":false},{"id":"da3a1383.9e211","type":"group","z":"d551e5.6a5cfe18","style":{"stroke":"#999999","stroke-opacity":"1","fill":"none","fill-opacity":"1","label":true,"label-position":"nw","color":"#a4a4a4"},"nodes":["9bce8f10.5d73a","e91b44a2.210da8","9f7adbf3.d62af8"],"x":1234,"y":759,"w":252,"h":162},{"id":"45811201.43cc8c","type":"pythonshell in","z":"d551e5.6a5cfe18","name":"BME680 Reader","pyfile":"/home/pi/bme680-python/examples/digi-env.py","virtualenv":"","continuous":true,"stdInData":false,"x":750,"y":240,"wires":[["56540ed2.e2842","c91d3262.08155"]]},{"id":"552a34f5.caaf84","type":"debug","z":"d551e5.6a5cfe18","name":"","active":false,"tosidebar":false,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":710,"y":440,"wires":[]},{"id":"ddc4d3ef.871be","type":"debug","z":"d551e5.6a5cfe18","name":"","active":false,"tosidebar":false,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":710,"y":340,"wires":[]},{"id":"9bce8f10.5d73a","type":"ui_gauge","z":"d551e5.6a5cfe18","g":"da3a1383.9e211","name":"Pressure Gauge","group":"e66437e4.1a68e8","order":5,"width":"8","height":"4","gtype":"gage","title":"","label":"Pressure HPA","format":"{{msg.payload.Pressure_HPA}}","min":0,"max":"1500","colors":["#00b500","#e6e600","#ca3838"],"seg1":"500","seg2":"1000","x":1340,"y":840,"wires":[]},{"id":"e3e148eb.6c59d","type":"ui_gauge","z":"d551e5.6a5cfe18","g":"b0696838.676458","name":"Temperature Gauge","group":"e66437e4.1a68e8","order":1,"width":"8","height":"4","gtype":"gage","title":"","label":"Temperature oCelsius","format":"{{msg.payload.Temperature_oC}}","min":0,"max":"40","colors":["#00b500","#e6e600","#ca3838"],"seg1":"20","seg2":"30","x":1360,"y":120,"wires":[]},{"id":"f7a4502f.f25b58","type":"ui_chart","z":"d551e5.6a5cfe18","g":"b0696838.676458","name":"Temperature Chart (oCelsius)","group":"863f6151.2b3ca8","order":1,"width":"10","height":"4","label":"","chartType":"line","legend":"false","xformat":"auto","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":"60","removeOlderPoints":"","removeOlderUnit":"60","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":1390,"y":80,"wires":[[]]},{"id":"408a9812.361928","type":"function","z":"d551e5.6a5cfe18","name":"Prepare Temperature","func":"var newMsg={};\nnewMsg.topic = 'Temperature_oC';\nnewMsg.payload = msg.payload.Temperature_oC;\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1100,"y":320,"wires":[["f7a4502f.f25b58"]]},{"id":"e12687de.a17a","type":"function","z":"d551e5.6a5cfe18","name":"Prepare Pressure","func":"var newMsg={};\nnewMsg.topic = 'Pressure_HPA';\nnewMsg.payload = msg.payload.Pressure_HPA\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1090,"y":440,"wires":[["e91b44a2.210da8"]]},{"id":"e91b44a2.210da8","type":"ui_chart","z":"d551e5.6a5cfe18","g":"da3a1383.9e211","name":"Pressure Chart (HPA)","group":"b4c4e00d.cbf16","order":2,"width":"15","height":"4","label":"","chartType":"line","legend":"false","xformat":"auto","interpolate":"linear","nodata":"","dot":false,"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,"useDifferentColor":false,"x":1360,"y":800,"wires":[[]]},{"id":"3434c172.45b926","type":"function","z":"d551e5.6a5cfe18","name":"Prepare Humidity","func":"var newMsg={};\nnewMsg.topic = 'RelativeHumidity_percent';\nnewMsg.payload = msg.payload.RelativeHumidity_percent;\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1090,"y":400,"wires":[["5fd30172.4d4c58"]]},{"id":"5b7698f6.faafc8","type":"ui_gauge","z":"d551e5.6a5cfe18","g":"4da19e82.5ebb2","name":"Humidity Gauge","group":"e66437e4.1a68e8","order":6,"width":"8","height":"4","gtype":"gage","title":"","label":"Humidity %","format":"{{msg.payload.RelativeHumidity_percent}}","min":0,"max":"100","colors":["#00b500","#80ff00","#ca3838"],"seg1":"30","seg2":"40","x":1340,"y":660,"wires":[]},{"id":"5fd30172.4d4c58","type":"ui_chart","z":"d551e5.6a5cfe18","g":"4da19e82.5ebb2","name":"Humidity Chart (%)","group":"a7a0d7.6c039f28","order":1,"width":"10","height":"4","label":"","chartType":"line","legend":"false","xformat":"auto","interpolate":"linear","nodata":"","dot":false,"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,"useDifferentColor":false,"x":1350,"y":620,"wires":[[]]},{"id":"8aee2381.d5cf3","type":"function","z":"d551e5.6a5cfe18","name":"Prepare VOC","func":"var newMsg={};\nnewMsg.topic = 'Resistance_Ohms';\nnewMsg.payload = msg.payload.Resistance_Ohms;\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1080,"y":360,"wires":[["1064d2f5.6920ad","e4934e73.c49b8"]]},{"id":"8c364894.a362a8","type":"ui_gauge","z":"d551e5.6a5cfe18","g":"c4a3f0fe.2d866","name":"VOC Gauge","group":"e66437e4.1a68e8","order":2,"width":"8","height":"4","gtype":"gage","title":"","label":"VOC Ohms","format":"{{msg.payload.Resistance_Ohms}}","min":0,"max":"300000","colors":["#ff0000","#e6e600","#6df906"],"seg1":"100000","seg2":"200000","x":1330,"y":480,"wires":[]},{"id":"b3022fd7.ba64f8","type":"ui_template","z":"d551e5.6a5cfe18","g":"b0696838.676458","group":"e66437e4.1a68e8","name":"Temperature Max and Min","order":3,"width":"8","height":"1","format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (oC):&emsp;<span style=\"color: green\">{{msg.temp.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.temp.max}}</span></span>\n</div>","storeOutMessages":false,"fwdInMessages":true,"templateScope":"local","x":1370,"y":160,"wires":[[]]},{"id":"d24141b4.8ed88","type":"function","z":"d551e5.6a5cfe18","name":"Prepare data","func":"var newMsg={temp:{},pressure:{},humidity:{},voc:{}};\nvar temp_min=flow.get('temp_min') || 100;\nvar temp_max=flow.get('temp_max') || -100;\nvar pressure_min=flow.get('pressure_min') || 5000;\nvar pressure_max=flow.get('pressure_max') || -5000;\nvar humidity_min=flow.get('humidity_min') || 100;\nvar humidity_max=flow.get('humidity_max') || -100;\nvar voc_min=flow.get('voc_min') || 500000;\nvar voc_max=flow.get('voc_max') || -500000;\n//\nnewMsg.payload = msg.payload;\n\n//\n\nif (msg.payload.Temperature_oC < temp_min) {\n   newMsg.temp.min = msg.payload.Temperature_oC;\n   flow.set('temp_min', msg.payload.Temperature_oC);\n} else {\n   newMsg.temp.min = temp_min;\n}\nif (msg.payload.Temperature_oC > temp_max) {\n   newMsg.temp.max = msg.payload.Temperature_oC;\n   flow.set('temp_max', msg.payload.Temperature_oC);\n} else {\n   newMsg.temp.max = temp_max;\n}\n\n//\n\nif (msg.payload.Pressure_HPA < pressure_min) {\n   newMsg.pressure.min = msg.payload.Pressure_HPA;\n   flow.set('pressure_min', msg.payload.Pressure_HPA);\n} else {\n   newMsg.pressure.min = pressure_min;\n}\nif (msg.payload.Pressure_HPA > pressure_max) {\n   newMsg.pressure.max = msg.payload.Pressure_HPA;\n   flow.set('pressure_max', msg.payload.Pressure_HPA);\n} else {\n   newMsg.pressure.max = pressure_max;\n}\n\n//\n\nif (msg.payload.RelativeHumidity_percent < humidity_min) {\n   newMsg.humidity.min = msg.payload.RelativeHumidity_percent;\n   flow.set('humidity_min', msg.payload.RelativeHumidity_percent);\n} else {\n   newMsg.humidity.min = humidity_min;\n}\nif (msg.payload.RelativeHumidity_percent > humidity_max) {\n   newMsg.humidity.max = msg.payload.RelativeHumidity_percent;\n   flow.set('humidity_max', msg.payload.RelativeHumidity_percent);\n} else {\n   newMsg.humidity.max = humidity_max;\n}\n\n//\n\nif (msg.payload.Resistance_Ohms < voc_min) {\n   newMsg.voc.min = msg.payload.Resistance_Ohms;\n   flow.set('voc_min', msg.payload.Resistance_Ohms);\n} else {\n   newMsg.voc.min = voc_min;\n}\nif (msg.payload.Resistance_Ohms > voc_max) {\n   newMsg.voc.max = msg.payload.Resistance_Ohms;\n   flow.set('voc_max', msg.payload.Resistance_Ohms);\n} else {\n   newMsg.voc.max = voc_max;\n}\n\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":730,"y":380,"wires":[["552a34f5.caaf84","408a9812.361928","e3e148eb.6c59d","b3022fd7.ba64f8","8aee2381.d5cf3","3434c172.45b926","e12687de.a17a","8c364894.a362a8","5b7698f6.faafc8","9bce8f10.5d73a","9f7adbf3.d62af8","9d6fbcc2.49f4b8","85b65f56.e570b"]]},{"id":"b323191b.6a76d","type":"join","z":"d551e5.6a5cfe18","name":"","mode":"custom","build":"merged","property":"payload","propertyType":"msg","key":"topic","joiner":"","joinerType":"str","accumulate":false,"timeout":"","count":"","reduceRight":false,"reduceExp":"","reduceInit":"","reduceInitType":"","reduceFixup":"","x":530,"y":340,"wires":[["d24141b4.8ed88","ddc4d3ef.871be"]]},{"id":"9f7adbf3.d62af8","type":"ui_template","z":"d551e5.6a5cfe18","g":"da3a1383.9e211","group":"e66437e4.1a68e8","name":"Pressure max and min","order":7,"width":"8","height":"1","format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (HPA):&emsp;<span style=\"color: green\">{{msg.pressure.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.pressure.max}}</span></span>\n</div>","storeOutMessages":false,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1360,"y":880,"wires":[[]]},{"id":"9d6fbcc2.49f4b8","type":"ui_template","z":"d551e5.6a5cfe18","g":"4da19e82.5ebb2","group":"e66437e4.1a68e8","name":"Humidity max and min","order":8,"width":"8","height":"1","format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (%):&emsp;<span style=\"color: green\">{{msg.humidity.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.humidity.max}}</span></span>\n</div>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":1360,"y":700,"wires":[[]]},{"id":"85b65f56.e570b","type":"ui_template","z":"d551e5.6a5cfe18","g":"c4a3f0fe.2d866","group":"e66437e4.1a68e8","name":"VOC max and min","order":4,"width":"8","height":"1","format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;Min (Ohms):&emsp;<span style=\"color: green\">{{msg.voc.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.voc.max}}</span></span>\n</div>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":1350,"y":520,"wires":[[]]},{"id":"452a5198.520f6","type":"ui_button","z":"d551e5.6a5cfe18","name":"Halt","group":"b4c4e00d.cbf16","order":4,"width":"2","height":"1","passthru":false,"label":"Shutdown","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","topicType":"str","x":410,"y":460,"wires":[["64212229.98256c"]]},{"id":"64212229.98256c","type":"exec","z":"d551e5.6a5cfe18","command":"sudo poweroff #","addpay":false,"append":"","useSpawn":"","timer":"","name":"turn off Pi","x":540,"y":460,"wires":[[],[],[]]},{"id":"4926710d.cc6af","type":"ui_button","z":"d551e5.6a5cfe18","name":"","group":"b4c4e00d.cbf16","order":2,"width":"1","height":"1","passthru":false,"label":"Reset","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":410,"y":400,"wires":[["82d547b0.18997"]]},{"id":"82d547b0.18997","type":"function","z":"d551e5.6a5cfe18","name":"Reset","func":"flow.set('temp_min', 100);\nflow.set('temp_max', -100);\nflow.set('pressure_min', 5000);\nflow.set('pressure_max', -5000);\nflow.set('humidity_min', 100);\nflow.set('humidity_max', -100);\nflow.set('voc_min', 5000000);\nflow.set('voc_max', -5000000);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":530,"y":400,"wires":[["d24141b4.8ed88"]]},{"id":"56540ed2.e2842","type":"split","z":"d551e5.6a5cfe18","name":"","splt":",","spltType":"str","arraySplt":1,"arraySpltType":"len","stream":false,"addname":"","x":320,"y":300,"wires":[["aca78c5f.5728a"]]},{"id":"aca78c5f.5728a","type":"json","z":"d551e5.6a5cfe18","name":"","property":"payload","action":"obj","pretty":false,"x":410,"y":340,"wires":[["b323191b.6a76d"]]},{"id":"15dc7f0b.66b7e1","type":"exec","z":"d551e5.6a5cfe18","command":"sudo reboot #","addpay":false,"append":"","useSpawn":"","timer":"","name":"Reboot","x":560,"y":520,"wires":[[],[],[]]},{"id":"8764f680.eaed08","type":"ui_button","z":"d551e5.6a5cfe18","name":"Reboot","group":"b4c4e00d.cbf16","order":4,"width":"2","height":"1","passthru":false,"label":"Reboot","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","topicType":"str","x":420,"y":520,"wires":[["15dc7f0b.66b7e1"]]},{"id":"1064d2f5.6920ad","type":"range","z":"d551e5.6a5cfe18","minin":"10000","maxin":"150000","minout":"100","maxout":"0","action":"clamp","round":true,"property":"payload","name":"LED Range VOC","x":1570,"y":400,"wires":[["72618df0.784504"]]},{"id":"72618df0.784504","type":"rpi-neopixels","z":"d551e5.6a5cfe18","name":"","gpio":18,"pixels":"8","bgnd":"255,255,255","fgnd":"000,255,000","wipe":"40","mode":"pcent","rgb":"rgb","brightness":"60","gamma":false,"x":1670,"y":320,"wires":[]},{"id":"b77fa80c.11ed38","type":"function","z":"d551e5.6a5cfe18","d":true,"g":"2a49f37b.3cc24c","name":"LED Function","func":"m=msg.payload\n\nif (m == 1)\n{\nreturn {Resistance_Ohms:payload};\n}\nelse if (m == 2)\n{\n    return {RelativeHumidity_percent:payload};\n}\n\nreturn msg;\n\n\n","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1380,"y":320,"wires":[[]]},{"id":"bbe40d5a.9fa9e","type":"ui_dropdown","z":"d551e5.6a5cfe18","d":true,"g":"2a49f37b.3cc24c","name":"","label":"LED Mode","tooltip":"","place":"Select option","group":"e66437e4.1a68e8","order":8,"width":0,"height":0,"passthru":false,"multiple":false,"options":[{"label":"VOC","value":1,"type":"num"},{"label":"Humidity","value":2,"type":"num"},{"label":"Pressure","value":3,"type":"num"}],"payload":"","topic":"mode","topicType":"msg","x":1350,"y":260,"wires":[["b77fa80c.11ed38"]]},{"id":"c91d3262.08155","type":"debug","z":"d551e5.6a5cfe18","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":980,"y":180,"wires":[]},{"id":"e4934e73.c49b8","type":"ui_chart","z":"d551e5.6a5cfe18","g":"c4a3f0fe.2d866","name":"","group":"e66437e4.1a68e8","order":9,"width":0,"height":0,"label":"chart","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"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,"useDifferentColor":false,"x":1330,"y":420,"wires":[[]]},{"id":"e66437e4.1a68e8","type":"ui_group","name":"Dashboard","tab":"6c90afc.b3623d","order":1,"disp":false,"width":"16","collapse":false},{"id":"863f6151.2b3ca8","type":"ui_group","name":"Temperature (oCelsius)","tab":"6c90afc.b3623d","order":2,"disp":true,"width":"15","collapse":false},{"id":"b4c4e00d.cbf16","type":"ui_group","name":"Pressure (HPA)","tab":"6c90afc.b3623d","order":5,"disp":true,"width":"15","collapse":false},{"id":"a7a0d7.6c039f28","type":"ui_group","name":"Humidity (%)","tab":"6c90afc.b3623d","order":4,"disp":true,"width":"15","collapse":false}]
2

Welcome to the forum @TheOzarkWizard

Hi, in order to make flow importable it is important to surround your code with three backticks
```
like this
```

You can edit and correct your post by clicking the pencil icon.

See this post for more details - How to share code or flow json

1 Like
3

Thanks for the input, I have fixed this

4

OK, I am able to import it ok now. For the future, when posting flows, please export just the nodes that are relevant to the problem so that it is easier to see what is going on.

Obviously we can't actually test your flow as it is too complex.

What hardware/OS are you running node-red and the browser on and which browser are you using? Can you try another browser.

Are you using the latest version of node-red and node-red-dashboard (you can check in Manage Palette in the dropdown menu. If not the latest please upgrade. If you upgrade the dashboard make sure you clear the cache in the browser.

If that doesn't fix it please stop node-red and restart it in a terminal and post the full startup log here, that will give us a lot of information about your system. When pasting the flow in use the same techniques as for flows so the forum does not mess with the forum.

5

I am running a raspberry pi zero w, raspbian 3.6, node-red v1.2.9, Issue is repeatable on all browsers, all devices. pi zero i guess doesnt have enough juice to run this dash through a browser over hdmi, so I have been connecting through my desktop, and I have tried laptop and android for ts. I have been using chrome, because everything else seems to crash after about 30 minutes.

Running all PC on windows 10, chrome browser

6

Does it continue if more data is added ?

7

As shown in the first screenshot, the sensor is polled every second, the new data points are added, the x axis scales accordingly, and everything works perfectly fine. however, once the client decides to refresh the browser page, the x axis scales incorrectly, adding several hours. this can be seen in the second screenshot. the data points and time are added every second, however they only occupy the selected amount of time that is supposed to be shown (in this case datapoints for the last 1 hour). Data is added every second in both cases. I have added the entire flow here just in case I have configured something up the line incorrectly.

8

correction, every other second

9

Any chance you can cut/paste some debug data from the output of the pythonshell node (ie so we can simulate) - thanks

1 Like
10

The last output from BME680 Reader was:

{"Temperature_oC":-130.80},{"Pressure_HPA":500.01},{"RelativeHumidity_percent":100.00},{"Resistance_Ohms":345088}

11

Add a debug node showing what is going into the chart and then refresh the page. What do you see in the debug node?

12

Here are the last few messages to the VOC chart (chart), after refresh:

5/12/2021, 2:36:58 PMnode: 1e595a8f.ee2875
Resistance_Ohms : msg.payload : number
364418
5/12/2021, 2:36:58 PMnode: 1e595a8f.ee2875
Resistance_Ohms : msg.payload : number
365220
5/12/2021, 2:37:00 PMnode: 1e595a8f.ee2875
Resistance_Ohms : msg.payload : number
367648

13

It isn't the last few messages that matter, it is whether any extra messages get sent when the refresh occurs.

Also what happens if you close the browser page and reopen it?

Have you got any ui_control nodes in your system?

14

I do not get any other messages when the page refreshes.
I do not have any ui_control nodes.

Closing the browser and reopening after clearing the client's cache gives the same result. opening it on another client after the problem occurs also yields the same result

I did forget to include these messages, which are the very first two received at the beginning of the script running: (debug attached to prepare VOC function, the input for the chart)

5/12/2021, 3:54:27 PMnode: 1e595a8f.ee2875
Resistance_Ohms : msg.payload : undefined
undefined
5/12/2021, 3:54:27 PMnode: 72618df0.784504
msg : error
"TypeError: Cannot read property 'toString' of undefined"

Im not sure that these would be relevant though, because when they are received, the chart works normally until a refresh happens later.

15

It doesn't seem likely, but can't rule it out. My philosophy is, if you have a problem that you don't understand, but also can see an issue that appears to unrelated but is easily fixable, is to fix the simple problem just in case it is related. So I suggest sorting those errors first.

What same result? Initially OK until you refresh that one or immediately showing incorrect data?

1 Like
16

Also, is it possible that any of the messages you send to the chart have msg.timestamp present?
Configure a Switch node like this and put it in the wire to the chart, with a debug on output 2. See if anything ever comes out of the second output.

image

17

"What same result? Initially OK until you refresh that one"

Yes, the chart works fine until the client browser page is refreshed

After configuring and attaching a switch node as you suggested, I get this message in debug (switch output 2):

5/13/2021, 9:15:18 PMnode: 72618df0.784504
msg : error
"TypeError: Cannot read property 'toString' of undefined"

18

You have a very odd message there, you need to work out where that is coming from, it is probably associated with the other similar outputs you reported.
Work back through the flow with debug nodes to work out where it is coming from.

1 Like
19

Thanks for your input, Im currently doing some troubleshooting on this, ill report back when i have some results

Are there any other chart modules you's recommend?

20

I had an extra pi that i thought was dead and a bme280 laying around. I though what the hell, might as well try it, and it works.

I have been able to recreate this problem on a separate raspberry pi zero w, on a fresh install, this time starting completely from scratch and using the sensor output directly. Here is this new flow:

[{"id":"d551e5.6a5cfe18","type":"tab","label":"BME280","disabled":false,"info":""},{"id":"9bce8f10.5d73a","type":"ui_gauge","z":"d551e5.6a5cfe18","name":"Pressure Gauge","group":"e66437e4.1a68e8","order":2,"width":5,"height":5,"gtype":"gage","title":"","label":"Pressure HPA","format":"{{msg.payload.Pressure_HPA}}","min":0,"max":"1500","colors":["#00b500","#e6e600","#ca3838"],"seg1":"500","seg2":"1000","x":1180,"y":580,"wires":[]},{"id":"e3e148eb.6c59d","type":"ui_gauge","z":"d551e5.6a5cfe18","name":"Temperature Gauge","group":"e66437e4.1a68e8","order":1,"width":5,"height":5,"gtype":"gage","title":"","label":"Temperature oCelsius","format":"{{msg.payload.Temperature_oC}}","min":0,"max":"40","colors":["#00b500","#e6e600","#ca3838"],"seg1":"20","seg2":"30","x":1200,"y":220,"wires":[]},{"id":"5b7698f6.faafc8","type":"ui_gauge","z":"d551e5.6a5cfe18","name":"Humidity Gauge","group":"e66437e4.1a68e8","order":3,"width":5,"height":5,"gtype":"gage","title":"","label":"Humidity %","format":"{{msg.payload.RelativeHumidity_percent}}","min":0,"max":"100","colors":["#00b500","#80ff00","#ca3838"],"seg1":"30","seg2":"40","x":1180,"y":400,"wires":[]},{"id":"b3022fd7.ba64f8","type":"ui_template","z":"d551e5.6a5cfe18","group":"e66437e4.1a68e8","name":"Temperature Max and Min","order":4,"width":4,"height":2,"format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (oC):&emsp;<span style=\"color: green\">{{msg.temp.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.temp.max}}</span></span>\n</div>","storeOutMessages":false,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1210,"y":260,"wires":[[]]},{"id":"9f7adbf3.d62af8","type":"ui_template","z":"d551e5.6a5cfe18","group":"e66437e4.1a68e8","name":"Pressure max and min","order":6,"width":5,"height":2,"format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (HPA):&emsp;<span style=\"color: green\">{{msg.pressure.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.pressure.max}}</span></span>\n</div>","storeOutMessages":false,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1200,"y":620,"wires":[[]]},{"id":"9d6fbcc2.49f4b8","type":"ui_template","z":"d551e5.6a5cfe18","group":"e66437e4.1a68e8","name":"Humidity max and min","order":7,"width":4,"height":2,"format":"<div layout=\"row\" layout-align=\"start center\">\n  <span flex>&emsp;&emsp;&emsp;&emsp;Min (%):&emsp;<span style=\"color: green\">{{msg.humidity.min}}</span>\n  &emsp;&emsp;Max:&emsp;<span flex style=\"color: red\">{{msg.humidity.max}}</span></span>\n</div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1200,"y":440,"wires":[[]]},{"id":"452a5198.520f6","type":"ui_button","z":"d551e5.6a5cfe18","name":"Halt","group":"b4c4e00d.cbf16","order":7,"width":2,"height":1,"passthru":false,"label":"Shutdown","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","topicType":"str","x":390,"y":480,"wires":[["64212229.98256c"]]},{"id":"64212229.98256c","type":"exec","z":"d551e5.6a5cfe18","command":"sudo poweroff #","addpay":false,"append":"","useSpawn":"","timer":"","name":"turn off Pi","x":520,"y":480,"wires":[[],[],[]]},{"id":"4926710d.cc6af","type":"ui_button","z":"d551e5.6a5cfe18","name":"","group":"b4c4e00d.cbf16","order":5,"width":1,"height":1,"passthru":false,"label":"Reset","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","topicType":"str","x":390,"y":420,"wires":[["82d547b0.18997"]]},{"id":"82d547b0.18997","type":"function","z":"d551e5.6a5cfe18","name":"Reset","func":"flow.set('temp_min', 100);\nflow.set('temp_max', -100);\nflow.set('pressure_min', 5000);\nflow.set('pressure_max', -5000);\nflow.set('humidity_min', 100);\nflow.set('humidity_max', -100);\nflow.set('voc_min', 5000000);\nflow.set('voc_max', -5000000);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":510,"y":420,"wires":[[]]},{"id":"15dc7f0b.66b7e1","type":"exec","z":"d551e5.6a5cfe18","command":"sudo reboot #","addpay":false,"append":"","useSpawn":"","timer":"","name":"Reboot","x":540,"y":540,"wires":[[],[],[]]},{"id":"8764f680.eaed08","type":"ui_button","z":"d551e5.6a5cfe18","name":"Reboot","group":"b4c4e00d.cbf16","order":6,"width":2,"height":1,"passthru":false,"label":"Reboot","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","topicType":"str","x":400,"y":540,"wires":[["15dc7f0b.66b7e1"]]},{"id":"7ebb59af.5711e8","type":"inject","z":"d551e5.6a5cfe18","name":"","props":[{"p":"payload"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":380,"y":340,"wires":[["78ca594.78232a8"]]},{"id":"78ca594.78232a8","type":"Bme280","z":"d551e5.6a5cfe18","name":"","bus":"1","address":"0x77","topic":"bme280","extra":false,"x":480,"y":240,"wires":[["20cff7d1.b23e48","a48b3f83.018bf","8553b931.67a1b8","29f564d4.97b61c"]]},{"id":"20cff7d1.b23e48","type":"change","z":"d551e5.6a5cfe18","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.temperature_C","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":780,"y":340,"wires":[["4517f132.2bd35","e3e148eb.6c59d","d92378ee.2f3ba8","f9b46cff.91c5b8"]]},{"id":"4517f132.2bd35","type":"ui_chart","z":"d551e5.6a5cfe18","name":"","group":"863f6151.2b3ca8","order":1,"width":0,"height":0,"label":"temp c","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":"3","removeOlderPoints":"5000","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":1150,"y":180,"wires":[[]]},{"id":"a48b3f83.018bf","type":"change","z":"d551e5.6a5cfe18","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.humidity","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":800,"y":420,"wires":[["b9aef2b0.aaead","5b7698f6.faafc8","7888c15d.37cd68"]]},{"id":"b9aef2b0.aaead","type":"ui_chart","z":"d551e5.6a5cfe18","name":"","group":"a7a0d7.6c039f28","order":1,"width":0,"height":0,"label":"Humidity","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":"3","removeOlderPoints":"5000","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":1160,"y":360,"wires":[[]]},{"id":"8553b931.67a1b8","type":"change","z":"d551e5.6a5cfe18","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.pressure_hPa","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":800,"y":480,"wires":[["83b0e37f.17bc6","9bce8f10.5d73a","7dae86fd.25d498"]]},{"id":"83b0e37f.17bc6","type":"ui_chart","z":"d551e5.6a5cfe18","name":"","group":"b4c4e00d.cbf16","order":1,"width":0,"height":0,"label":"pressure","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":"6","removeOlderPoints":"20000","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":1160,"y":540,"wires":[[]]},{"id":"2a498c05.159684","type":"function","z":"d551e5.6a5cfe18","name":"","func":"var newMsg={temp:{},humidity:{},pressure:{},};\nvar temp_min=flow.get('temp_min') || 100;\nvar temp_max=flow.get('temp_max') || -100;\nvar pressure_min=flow.get('pressure_min') || 5000;\nvar pressure_max=flow.get('pressure_max') || -5000;\nvar humidity_min=flow.get('humidity_min') || 100;\nvar humidity_max=flow.get('humidity_max') || -100;\n//\nnewMsg.payload = msg.payload;\n\n//\n\nif (msg.payload.temperature_C < temp_min) {\n   newMsg.temp.min = msg.payload.temperature_C;\n   flow.set('temp_min', msg.payload.temperature_C);\n} else {\n   newMsg.temp.min = temp_min;\n}\nif (msg.payload.temperature_C > temp_max) {\n   newMsg.temp.max = msg.payload.temperature_C;\n   flow.set('temp_max', msg.payload.temperature_C);\n} else {\n   newMsg.temp.max = temp_max;\n}\n\n//\n\nif (msg.payload.pressure_hPa < pressure_min) {\n   newMsg.pressure.min = msg.payload.pressure_hPa;\n   flow.set('pressure_min', msg.payload.pressure_hPa);\n} else {\n   newMsg.pressure.min = pressure_min;\n}\nif (msg.payload.pressure_hPa > pressure_max) {\n   newMsg.pressure.max = msg.payload.pressure_hPa;\n   flow.set('pressure_max', msg.payload.pressure_hPa);\n} else {\n   newMsg.pressure.max = pressure_max;\n}\n\n//\n\nif (msg.payload.humidity < humidity_min) {\n   newMsg.humidity.min = msg.payload.humidity;\n   flow.set('humidity_min', msg.payload.humidity);\n} else {\n   newMsg.humidity.min = humidity_min;\n}\nif (msg.payload.humidity > humidity_max) {\n   newMsg.humidity.max = msg.payload.humidity;\n   flow.set('humidity_max', msg.payload.humidity);\n} else {\n   newMsg.humidity.max = humidity_max;\n}\n\n\nreturn newMsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":800,"y":260,"wires":[["b3022fd7.ba64f8","9f7adbf3.d62af8","9d6fbcc2.49f4b8","8b8f622.4b019a"]]},{"id":"29f564d4.97b61c","type":"range","z":"d551e5.6a5cfe18","minin":"0","maxin":"100","minout":"0","maxout":"100","action":"clamp","round":true,"property":"payload.humidity","name":"","x":730,"y":640,"wires":[["2a498c05.159684"]]},{"id":"8b8f622.4b019a","type":"debug","z":"d551e5.6a5cfe18","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":960,"y":100,"wires":[]},{"id":"7dae86fd.25d498","type":"debug","z":"d551e5.6a5cfe18","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":1190,"y":660,"wires":[]},{"id":"d92378ee.2f3ba8","type":"debug","z":"d551e5.6a5cfe18","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":1170,"y":300,"wires":[]},{"id":"7888c15d.37cd68","type":"debug","z":"d551e5.6a5cfe18","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":1190,"y":480,"wires":[]},{"id":"f9b46cff.91c5b8","type":"ui_chart","z":"d551e5.6a5cfe18","name":"","group":"e66437e4.1a68e8","order":10,"width":0,"height":0,"label":"chart","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"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,"useDifferentColor":false,"x":1040,"y":720,"wires":[[]]},{"id":"e66437e4.1a68e8","type":"ui_group","name":"Dashboard","tab":"6c90afc.b3623d","order":1,"disp":false,"width":15,"collapse":false},{"id":"b4c4e00d.cbf16","type":"ui_group","name":"Pressure (HPA)","tab":"6c90afc.b3623d","order":4,"disp":true,"width":15,"collapse":false},{"id":"863f6151.2b3ca8","type":"ui_group","name":"Temperature (oCelsius)","tab":"6c90afc.b3623d","order":2,"disp":true,"width":15,"collapse":false},{"id":"a7a0d7.6c039f28","type":"ui_group","name":"Humidity (%)","tab":"6c90afc.b3623d","order":3,"disp":true,"width":15,"collapse":false},{"id":"6c90afc.b3623d","type":"ui_tab","name":"BME280","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

The issue occurs when the chart X axis values are adjusted up, and then down. For example, I set the x axis on 2/3 charts to display the last 6 hours and deployed, decided that was way overkill and turned these 2 down to show the last 3 hours instead with 1K-5K last points, deploy, refresh, and I get 2 broken charts.
The last chart that I did not touch works all the time. I added another chart without deleting the broken ones to make sure that the new chart spawns on a new configuration node and sure enough the new chart works fine. the old charts are still broken but they work for a few seconds every few refreshes.