{"options":{"scales":{"xAxes":[{"type":"time","time":{"min":1572697299066}}]}}}
Agree, but if I also create a valid ui_control message (see above) I still see no change in the UI.
?
What types of changes are you looking for at this point?
Please provide your full flow again.
I looking for a easy way to change the X axis during the runtime,
[{"id":"cd9e47f3.c0e718","type":"tab","label":"Flow 2","disabled":false,"info":""},{"id":"5d1b683.cca8798","type":"ui_chart","z":"cd9e47f3.c0e718","name":"","group":"195cd998.7632b6","order":1,"width":0,"height":0,"label":"Melt Temperature","chartType":"line","legend":"false","xformat":"auto","interpolate":"linear","nodata":"awaiting data...","dot":false,"ymin":"0","ymax":"1000","removeOlder":"30","removeOlderPoints":"","removeOlderUnit":"60","cutout":0,"useOneColor":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"useOldStyle":false,"outputs":1,"x":864,"y":386,"wires":[[]]},{"id":"5b06b35d.8aa9bc","type":"inject","z":"cd9e47f3.c0e718","name":"","topic":"","payload":"","payloadType":"str","repeat":"5","crontab":"","once":false,"onceDelay":"","x":354,"y":426,"wires":[["5dad34da.a11c7c"]]},{"id":"5dad34da.a11c7c","type":"random","z":"cd9e47f3.c0e718","name":"random between 1 - 500","low":"1","high":"500","inte":"false","property":"payload","x":544,"y":426,"wires":[["5d1b683.cca8798"]]},{"id":"ae2baf51.522b7","type":"function","z":"cd9e47f3.c0e718","name":"Format chart","func":"\nvar x = flow.get('chartprops').xaxis.min; //time back in milliseconds\nvar y = flow.get('chartprops');\nnode.status({text: x});\nvar d = new Date().getTime() - x //current time in milliseconds - desired time\ndelete msg.payload;\ndelete msg.topic;\n\n//send all modification in one go\nmsg.ui_control = { \n options: {\n scales: {\n xAxes: [{\n type: 'time',\n time: {\n min: d\n }\n }]\n }\n }\n}\nreturn msg; \n\n","outputs":1,"noerr":0,"x":644,"y":366,"wires":[["5d1b683.cca8798","2223b350.8af84c"]]},{"id":"90b940c6.ee8c","type":"ui_text_input","z":"cd9e47f3.c0e718","name":"","label":"Minutes","tooltip":"","group":"b555fa85.b63bd8","order":3,"width":0,"height":0,"passthru":true,"mode":"number","delay":300,"topic":"time","x":374,"y":196,"wires":[["fedec5e0.22c288","50e1850d.2a496c"]]},{"id":"fedec5e0.22c288","type":"function","z":"cd9e47f3.c0e718","name":"Store chart options","func":"var chartprops = flow.get('chartprops')\nif (!chartprops) {chartprops = {};}\nswitch(msg.topic){\n case 'time':{\n chartprops.xaxis = {};\n chartprops.xaxis.min = {};\n chartprops.xaxis.min = msg.payload * 60000;\n flow.set('chartprops',chartprops);\n node.status({text: chartprops.xaxis.min});\n break;\n }\n}\nflow.set('chartprops',chartprops)\n// message continues to flow but in next node properties will be deleted\n// it will be used only as change event\nreturn msg;\n","outputs":1,"noerr":0,"x":584,"y":236,"wires":[["ae2baf51.522b7","f98aa567.cd0068"]]},{"id":"b0cf3b4b.89c358","type":"inject","z":"cd9e47f3.c0e718","name":"Resend chart format","topic":"","payload":"","payloadType":"date","repeat":"60","crontab":"","once":true,"onceDelay":"1","x":374,"y":366,"wires":[["ae2baf51.522b7"]]},{"id":"353a44f7.2200ac","type":"comment","z":"cd9e47f3.c0e718","name":"Resend - read comments !","info":"If minimum time is sent to chart, it will be absolute\nChart does not take it as time frame\nSo if change is in minutes, it is reasonable enough\nto send new min value to chart in every minute\nto hold time frame constant","x":384,"y":326,"wires":[]},{"id":"2223b350.8af84c","type":"debug","z":"cd9e47f3.c0e718","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":892,"y":288,"wires":[]},{"id":"50e1850d.2a496c","type":"debug","z":"cd9e47f3.c0e718","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":608,"y":180,"wires":[]},{"id":"f98aa567.cd0068","type":"debug","z":"cd9e47f3.c0e718","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":800,"y":219,"wires":[]},{"id":"195cd998.7632b6","type":"ui_group","z":"","name":"Charts","tab":"69dacb8c.3da294","order":3,"disp":true,"width":"6"},{"id":"b555fa85.b63bd8","type":"ui_group","z":"","name":"Chart Scaling","tab":"69dacb8c.3da294","order":2,"disp":true,"width":"3","collapse":true},{"id":"69dacb8c.3da294","type":"ui_tab","z":"","name":"DS Pilot Extrusion Line","icon":"dashboard","order":2}]
With the flow you just provided, if you open the debug tab, what do you see?
No error. Just see the payload as above mentioned.
The question is not to fix the flow, it is more if the msg.ui_controll with the following payload should work
{"options":{"scales":{"xAxes":[{"type":"time","time":{"min":1572697299066}}]}}}
are you saying that when looking at the graph, if you change the "Chart Scaling" number, nothing changes?
If you want the ability to take a graph and drill down at a particular time, you might want to investigate Influx and Grafana.
are you saying that when looking at the graph, if you change the "Chart Scaling" number, nothing changes?
Yes,
If you want the ability to take a graph and drill down at a particular time, you might want to investigate Influx and Grafana.
I already have a ELK instance running with all these feature. But i want to check if I find a solution to draw charts with variables X-axis (time)
That is also the heading of this topic 
Here is what I see.
What versions of
- node-red:
- node.js:
- node-red-dashboard:
- what OS and version:
- What browser:
Woho - that is interesting Exaclty what I looking for.
- node-red:
v0.20.2 - node.js:
v10.17.0 - node-red-dashboard:
2.14.0 - what OS and version:
Raspbian GNU/Linux 9 (stretch) / Linux raspberrypi 4.19.66-v7+ #1253 SMP Thu Aug 15 11:49:46 BST 2019 armv7l GNU/Linux - What browser:
chrome @ Windows
Maybe you should update NR. (current release is 1.0.2) and the dashboard (current release is 2.17.1) - You could try updating the dashboard first via the pallette manager in the hamburger menu and use the script to update NR on the Pi.
BUT make sure to backup your flows first or even better, backup your SD card first.
I think versions you are using should do fine, but nothing bad if you can update.
Try this flow, minimum example. Inject the xaxis change and see if chart updates.
[{"id":"b93abfb6.f7fbd","type":"function","z":"6d08d5ab.a8aa3c","name":"format xaxis","func":"msg.ui_control = {\"options\":{\"scales\":{\"xAxes\":[{\"type\":\"time\",\"time\":{\"min\":1572697299066}}]}}}\ndelete msg.payload\nreturn msg;","outputs":1,"noerr":0,"x":310,"y":270,"wires":[["d08b2f20.3bba"]]},{"id":"39953dee.74e102","type":"inject","z":"6d08d5ab.a8aa3c","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":140,"y":270,"wires":[["b93abfb6.f7fbd"]]},{"id":"d08b2f20.3bba","type":"ui_chart","z":"6d08d5ab.a8aa3c","name":"","group":"a2c09fe8.458d6","order":0,"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,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"useOldStyle":false,"outputs":1,"x":480,"y":220,"wires":[[]]},{"id":"289dc783.dea618","type":"random","z":"6d08d5ab.a8aa3c","name":"","low":"1","high":"10","inte":"true","property":"payload","x":320,"y":160,"wires":[["d08b2f20.3bba"]]},{"id":"2b9447a7.da11b8","type":"inject","z":"6d08d5ab.a8aa3c","name":"","topic":"","payload":"","payloadType":"date","repeat":"2","crontab":"","once":false,"onceDelay":0.1,"x":150,"y":160,"wires":[["289dc783.dea618"]]},{"id":"b8d55f0a.a6f0e","type":"inject","z":"6d08d5ab.a8aa3c","name":"","topic":"","payload":"[]","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":310,"y":220,"wires":[["d08b2f20.3bba"]]},{"id":"a2c09fe8.458d6","type":"ui_group","z":"","name":"Default","tab":"5074feb8.5be66","disp":true,"width":"6","collapse":false},{"id":"5074feb8.5be66","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]
+1
Updated the dashboard --> works fine 
Thx a lot!
Fine
Just downgraded the dashboard to 2.14 and can tell, it's not working.
But all good for now.
1 Like
If i using this method, the msg.ui_control.ymax doesnĀ“t work anymore.
Is there a way to set x and y axis together?
optional with the locale time "DE-de" or setting like "HH:mm"?
Then i can reduce my Dashboard from 12h & 48h Diagramms to one Variable Line-Chart.
Here my Problem with Pictures
If i Zoom to 2h thereĀ“s no way to scale between 15 and 25 Degrees.
It uses the Zero point from the 22h Picture!
Code:
[{"id":"2beb9667.d6c5da","type":"inject","z":"180e72ba.ee3d05","name":"Resend chart format","props":[{"p":"payload","v":"","vt":"date"},{"p":"topic","v":"","vt":"string"}],"repeat":"60","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"","payloadType":"date","x":380,"y":140,"wires":[["ebda5a68.75ddb8"]]},{"id":"2c5a7113.08857e","type":"ui_text_input","z":"180e72ba.ee3d05","name":"","label":"Stunden Temp.","tooltip":"","group":"7df748d.cf8d2b8","order":5,"width":3,"height":1,"passthru":true,"mode":"number","delay":300,"topic":"time","sendOnBlur":true,"className":"","topicType":"str","x":100,"y":200,"wires":[["f3b098b8.34bf78"]]},{"id":"f3b098b8.34bf78","type":"function","z":"180e72ba.ee3d05","name":"Store chart options","func":"var chartprops = flow.get('chartprops')\nif (!chartprops) {chartprops = {};}\nswitch(msg.topic){\n case 'time':{\n chartprops.xaxis = {};\n chartprops.xaxis.min = {};\n chartprops.xaxis.min = msg.payload * 3600000;\n flow.set('chartprops',chartprops);\n node.status({text: chartprops.xaxis.min});\n break;\n }\n}\nflow.set('chartprops',chartprops)\n// message continues to flow but in next node properties will be deleted\n// it will be used only as change event\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","x":310,"y":200,"wires":[["ebda5a68.75ddb8"]]},{"id":"ebda5a68.75ddb8","type":"function","z":"180e72ba.ee3d05","name":"Format chart","func":"var x = flow.get('chartprops').xaxis.min; //time back in milliseconds\nvar y = flow.get('chartprops');\nnode.status({text: x});\nvar d = new Date().getTime(\"de-DE\") - x //current time in milliseconds - desired time\ndelete msg.payload;\ndelete msg.topic;\n\n//send all modification in one go\nmsg.ui_control = {\n options: {\n scales: {\n xAxes: [{\n type: 'time',\n time: {\n min: d\n }\n }]\n }\n }\n}\nreturn msg; \n\n\n\n","outputs":1,"noerr":0,"initialize":"","finalize":"","x":510,"y":200,"wires":[["11b30de1.9f1cb2"]]},{"id":"11b30de1.9f1cb2","type":"ui_chart","z":"180e72ba.ee3d05","name":"","group":"e79e709c.0f8a08","order":8,"width":27,"height":8,"label":"48h Temperaturen","chartType":"line","legend":"true","xformat":"HH:mm","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":"48","removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":750,"y":400,"wires":[[]]},{"id":"31d120d1.7ecdc8","type":"change","z":"180e72ba.ee3d05","name":"Bad","rules":[{"t":"set","p":"topic","pt":"msg","to":"Bad","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":490,"y":280,"wires":[["11b30de1.9f1cb2","5572b856.30c828"]]},{"id":"731bbc93.9ae504","type":"change","z":"180e72ba.ee3d05","name":"Hobby","rules":[{"t":"set","p":"topic","pt":"msg","to":"Hobby","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":490,"y":320,"wires":[["11b30de1.9f1cb2"]]},{"id":"253401e.2b64d7e","type":"change","z":"180e72ba.ee3d05","name":"Fabian","rules":[{"t":"set","p":"topic","pt":"msg","to":"Fabian","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":360,"wires":[["11b30de1.9f1cb2"]]},{"id":"7884e717.a72288","type":"change","z":"180e72ba.ee3d05","name":"Hannah","rules":[{"t":"set","p":"topic","pt":"msg","to":"Hannah","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":400,"wires":[["11b30de1.9f1cb2"]]},{"id":"5aa1946a.748214","type":"change","z":"180e72ba.ee3d05","name":"Eltern","rules":[{"t":"set","p":"topic","pt":"msg","to":"Eltern","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":490,"y":440,"wires":[["11b30de1.9f1cb2"]]},{"id":"8423dce3.307a18","type":"change","z":"180e72ba.ee3d05","name":"Wohnzimmer","rules":[{"t":"set","p":"topic","pt":"msg","to":"Wohnzimmer","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":510,"y":480,"wires":[["11b30de1.9f1cb2"]]},{"id":"3c96dc3b.592a34","type":"change","z":"180e72ba.ee3d05","name":"Flur OG","rules":[{"t":"set","p":"topic","pt":"msg","to":"Flur OG","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":520,"wires":[["11b30de1.9f1cb2"]]},{"id":"293ea919.07c056","type":"ccu-value","z":"180e72ba.ee3d05","name":"Thermostat Flur OG","iface":"BidCos-RF","channel":"MEQ1577235:1 Thermostat Bad:1","datapoint":"TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":260,"y":520,"wires":[["3c96dc3b.592a34"]]},{"id":"2ecfd963.92a40e","type":"ccu-value","z":"180e72ba.ee3d05","name":"Heizung WZ","iface":"BidCos-RF","channel":"LEQ0581647:4 Thermostat Wohnzimmer","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":230,"y":480,"wires":[["8423dce3.307a18"]]},{"id":"7c0cd2c5.5500f4","type":"ccu-value","z":"180e72ba.ee3d05","name":"","iface":"BidCos-RF","channel":"LEQ0861116:4 Thermostat Eltern","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":250,"y":440,"wires":[["5aa1946a.748214"]]},{"id":"74dcc7ab.ea8a58","type":"ccu-value","z":"180e72ba.ee3d05","name":"","iface":"BidCos-RF","channel":"MEQ0447613:4 Thermostat Hannah","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":260,"y":400,"wires":[["7884e717.a72288"]]},{"id":"9a304ec7.9d7e7","type":"ccu-value","z":"180e72ba.ee3d05","name":"","iface":"BidCos-RF","channel":"LEQ0584025:4 Heizung Bad Handtuch:4","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":270,"y":360,"wires":[["253401e.2b64d7e"]]},{"id":"eafbf96b.bb8fd","type":"ccu-value","z":"180e72ba.ee3d05","name":"Hobby","iface":"BidCos-RF","channel":"JEQ0137984:1 HM-CC-TC JEQ0137984:1","datapoint":"TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":210,"y":320,"wires":[["731bbc93.9ae504"]]},{"id":"655c901f.4a671","type":"ccu-value","z":"180e72ba.ee3d05","name":"Thermostat Bad Wand","iface":"HmIP-RF","channel":"00119D899417F9:1 HmIP-eTRV-C 00119D899417F9:1","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":260,"y":280,"wires":[["31d120d1.7ecdc8"]]},{"id":"75ef0412.f68e7c","type":"ccu-value","z":"180e72ba.ee3d05","name":"Thermostat WZ","iface":"HmIP-RF","channel":"000E9A4995C88A:1","datapoint":"ACTUAL_TEMPERATURE","mode":"","start":true,"change":true,"cache":true,"queue":false,"on":0,"onType":"undefined","ramp":0,"rampType":"undefined","working":false,"ccuConfig":"f75ea50d.7c1ef8","topic":"${CCU}/${Interface}/${channel}/${datapoint}","x":240,"y":620,"wires":[["6917c1f3.d9894"]]},{"id":"6917c1f3.d9894","type":"trigger","z":"180e72ba.ee3d05","name":"5 min","op1":"","op2":"0","op1type":"pay","op2type":"str","duration":"-5","extend":false,"overrideDelay":false,"units":"min","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":390,"y":620,"wires":[["a400f5c8.cb1c88"]]},{"id":"a400f5c8.cb1c88","type":"change","z":"180e72ba.ee3d05","name":"Thermostat Wohnzimmer","rules":[{"t":"set","p":"topic","pt":"msg","to":"Wohnzimmer Thermostat","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":590,"y":620,"wires":[["11b30de1.9f1cb2"]]},{"id":"7df748d.cf8d2b8","type":"ui_group","name":"Steuerung","tab":"c0579eb0.e9c8c","order":2,"disp":true,"width":"3","collapse":false,"className":""},{"id":"e79e709c.0f8a08","type":"ui_group","name":"Temperaturen","tab":"c0579eb0.e9c8c","order":1,"disp":true,"width":27,"collapse":true,"className":""},{"id":"f75ea50d.7c1ef8","type":"ccu-connection","name":"Zuhause","host":"192.168.10.10","regaEnabled":true,"bcrfEnabled":true,"iprfEnabled":true,"virtEnabled":true,"bcwiEnabled":true,"cuxdEnabled":false,"regaPoll":true,"regaInterval":"30","rpcPingTimeout":"60","rpcInitAddress":"","rpcServerHost":"192.168.10.10","rpcBinPort":"2040","rpcXmlPort":"2041","tls":false,"inSecure":false,"authentication":false,"username":"","password":"","queueTimeout":"5000","queuePause":"250","contextStore":""},{"id":"c0579eb0.e9c8c","type":"ui_tab","name":"Heizung","icon":"dashboard","order":1,"disabled":false,"hidden":false}]
Excellent, that's what I was looking for.
Hi hotNipi and zenofmud,
thanks for the idea. I tried it and it is working.
But the format of the axis will be changed.
Do you have an idea with a dynamic x-axis with the original format?
Explore examples from this topic
1 Like
