# Need Help with Real-Time Graphs in Node-RED? Seeking Advice!
**URL:** https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781
**Category:** Dashboard
**Tags:** dashboard-2
**Created:** [29 October 2024 20:23 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781 "2024-10-29T20:23:16Z")
**Posts on this page:** 14
**Page:** 1
### Author:  [@Ayoub](https://discourse.nodered.org/u/Ayoub)
#### Post date: [29 October 2024 20:23 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/1 "2024-10-29T20:23:16Z")
Hello,
I hope you're doing well. I am currently working on a real-time weather application with Node-RED and I have a question regarding data visualization on graphs, for example, temperature.
I'm facing an issue with how the data is displayed over time. As new data is collected, the origin of the time axis (for example, 5:00 PM for an initial temperature of 10ยฐC) shifts. I would like to know if it's possible to fix the first value of the x-axis (for example, 5:00 PM) while dynamically adjusting the last point, so that the graph shows a rolling 24-hour period with an automatically updated interval.
Do you have any suggestions or advice on how to resolve this issue? Thank you in advance for your help.
---
### Author:  [@xx\_Nexus\_xx](https://discourse.nodered.org/u/xx_Nexus_xx)
#### Post date: [30 October 2024 03:59 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/3 "2024-10-30T03:59:26Z")
The chart nodes is consuming a lot of memory (and has a memory leak in D2). Therefore I'm using Grafana to setup my dashboards and showing them with iframe in Node-Red dashboard!
You can specify any timeline you want .. I have a slider at the bottom to adjust the number of hours I want to watch into the past
the method to use grafana in Node-Red is described [here](https://flows.nodered.org/flow/8e96b8630c4edc866aa0459354033c9b)
---
### Author:  [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [30 October 2024 09:09 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/4 "2024-10-30T09:09:09Z")
> [@xx\_Nexus\_xx](#):
>
> (and has a memory leak in D2)
Does it? Could you clarify this please?
---
### Author:  [@xx\_Nexus\_xx](https://discourse.nodered.org/u/xx_Nexus_xx)
#### Post date: [30 October 2024 10:40 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/5 "2024-10-30T10:40:59Z")
Hi @joepavitt , we had the discussion already in [another topic here](https://discourse.nodered.org/t/no-response-disconnect-of-db2/89929/13) in the forum.
I had setup several charts to display weather information. The data was read from [https://api.open-meteo.com/](https://api.open-meteo.com/) and than transformed into the array for the charts. When running the dashboard for 24-36 hours, the browser (Windows Chrome in my instance) is crashing and showing white-page with error message "Oups ..out of memory" .. when disabling the charts (see below) the dasboard is running for days and weeks.
[chart.json](https://discourse.nodered.org/uploads/short-url/A1DBmBq3u0QDhpnpsM88SPMsAkE.json) (2.1 KB)
---
### Author:  [@Colin](https://discourse.nodered.org/u/Colin)
#### Post date: [30 October 2024 19:24 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/6 "2024-10-30T19:24:40Z")
You have shared only one node (an http request). Please select the charts and export those. Rather than attaching a file please paste the flow text here. In order to make code readable and usable it is necessary to surround your code with three backticks (also known as a left quote or backquote `````)
````auto
```
code goes here
```
````
See this post for more details - [How to share code or flow json](https://discourse.nodered.org/t/how-to-share-code-or-flow-json/506)
Also tell us how many lines are on each chart and what rate they are updated.
Have you worked out the total number of data points that the charts will hold once the charts are all full?
---
### Author:  [@xx\_Nexus\_xx](https://discourse.nodered.org/u/xx_Nexus_xx)
#### Post date: [30 October 2024 22:15 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/7 "2024-10-30T22:15:59Z")
yeah .. I tried that but getting the error "An error occurred: Body is limited to 32000 characters; you entered 41388." when adding the code with the ```
sorry can only upload again .. this time not just the http ๐
[chart\_code.json](https://discourse.nodered.org/uploads/short-url/x3yRSJWL3ZexlKVplMxYbx78fUt.json) (39.8 KB)
---
### Author:  [@Ayoub](https://discourse.nodered.org/u/Ayoub)
#### Post date: [30 October 2024 22:34 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/8 "2024-10-30T22:34:44Z")
> [@jbudd](#):
>
> Welcome to the forum @Ayoub.
>
> You can store the data as an array in a context variable, preferably using a filesystem store.
> A function like this should work
>
> ```auto
> const recordsin24hours = 6 // Or however many!
> let data = context.get("weatherdata") ?? []
>
> const newdata = { "timestamp": new Date(), "temperature": msg.payload } // construct new element
> data.push(newdata) // add it to the array
> if (data.length > recordsin24hours) {
> data.shift() //Throw away the oldest element
> }
> context.set("weatherdata", data)
> msg.payload = data
> return msg;
>
> ```
Thank you very much for your response! Iโm currently going through it as I'm a beginner with Node-RED. I really appreciate your help
---
### Author:  [@Ayoub](https://discourse.nodered.org/u/Ayoub)
#### Post date: [30 October 2024 22:41 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/9 "2024-10-30T22:41:20Z")
@xx_Nexus_xx Thank you very much for your response. I'm still a beginner with Node-RED, so I will try to fully understand your answer, and if I have any questions, I will ask them, if that's alright with you. Once again, thank you for your response and your help ๐ ๐
---
### Author:  [@xx\_Nexus\_xx](https://discourse.nodered.org/u/xx_Nexus_xx)
#### Post date: [30 October 2024 23:00 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/10 "2024-10-30T23:00:38Z")
You are welcome.... as this is Node-Red there are plenty of ways to achieve an outcome .. it really depends on you personal preference ๐ ... but thats the fun of it ๐
---
### Author:  [@Buckskin](https://discourse.nodered.org/u/Buckskin)
#### Post date: [31 October 2024 19:08 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/11 "2024-10-31T19:08:11Z")
If you set the x-Axis limit to 24 hours you should get a graph (after 24 hrs) that runs from current time on the right to 24 hrs ago on the left. This one is a simple chart using the incoming data as sent by sensor
---
### Author:  [@Colin](https://discourse.nodered.org/u/Colin)
#### Post date: [31 October 2024 21:44 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/12 "2024-10-31T21:44:31Z")
Can you provide an inject node configured with sample data so that we can test it please?
You did not answer the questions:
> [@Colin](#):
>
> Also tell us how many lines are on each chart and what rate they are updated.
>
> Have you worked out the total number of data points that the charts will hold once the charts are all full?
---
### Author:  [@xx\_Nexus\_xx](https://discourse.nodered.org/u/xx_Nexus_xx)
#### Post date: [31 October 2024 22:44 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/13 "2024-10-31T22:44:21Z")
Hi Colin, thx for the follow up I really missed that point
1. I have updated the sample flow with an inject node holding the METEO data. This data set is usually updated every 60min
[Weather\_chart.json](https://discourse.nodered.org/uploads/short-url/asiltPLMo7XfCqWrt7qCEqz3kVc.json) (79.4 KB)
2. in my function node ("to graph") I'm reducing the data array for the chart-graph and only using the hourly data for next 3 days
3. Each chart-graph can hold upto 5 arrays or lines ==\> 365 data points max per chart
4. in this example I have 6 chart-graphs with upto 2190 datapoints ... should not be a problem ๐
5. the chart-graph is configure to "replace" the data every time a new set arrives .. therefore there should not be any increase in buffer usage (so my understanding) .. the above charts are getting updated every hour
6. unfortunately, when running this flow over 24-36 hous, the browser (Chrome in my case) is crashing with ""Oups ..out of memory" message .. it works well after a normal refresh (F5).. but is a bit "wife-unfriendly" when running on my wall-mounted control dashboard in the living-room ๐
7. since I disabled the chart nodes about 6 weeks ago, the browser did not crash at all. The flow till the function node "to graph" is still running as I'm using the data for further automation
I think this is now getting off-topic of this thread .. but I'm happy to provide more input in this or another thread
Screen sample:
PS: I have reactivated my chart-graphs so I can capture the browser error and will post when it happens
---
### Author:  [@Colin](https://discourse.nodered.org/u/Colin)
#### Post date: [1 November 2024 10:16 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/14 "2024-11-01T10:16:02Z")
I think probably you should submit an issue report at [Issues ยท FlowFuse/node-red-dashboard ยท GitHub](https://github.com/FlowFuse/node-red-dashboard/issues) giving the details that you have posted here. Your use case is unusual and perhaps there is a memory leak in the browser code. Though if you are only updating once an hour it seems surprising as not much data will have been transferred. Are you sure it only sends data to the charts once an hour? To confirm this, add debug nodes showing the data going to the chart.
When you replace existing data points will they have _exactly_ the same timestamps as before?
I presume you are using the latest version of the dashboard (1.18.1).
---
### Author:  [@system](https://discourse.nodered.org/u/system)
#### Post date: [1 December 2024 10:16 UTC](https://discourse.nodered.org/t/need-help-with-real-time-graphs-in-node-red-seeking-advice/92781/15 "2024-12-01T10:16:08Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.