# Reading from an Array into a chart

**URL:** <https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874>\
**Category:** Dashboard\
**Created:** [2 December 2020 13:36 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874 "2020-12-02T13:36:21Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Silver](https://avatars.discourse-cdn.com/v4/letter/s/a3d4f5/32.png) [@Silver](https://discourse.nodered.org/u/Silver)\
**Post date:** [2 December 2020 13:36 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/1 "2020-12-02T13:36:21Z")

</div>

Hi there,

I am experiencing issues trying to write my data from this array into a chart, I have looked at similar issues but I can not seem to come to a solution. I am not strong at all in Javascript.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/b/8b146036d6a1748844b64f83199ee6b3b0d14126.png)

Here is a screenshot of my flow,

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/a/ea982f5f26055b70d0bf8406905a17c97e18fe04.png)

Kind Regards,  
Jordan

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [2 December 2020 13:52 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/2 "2020-12-02T13:52:20Z")

</div>

Hi and welcome to forum.  
Based on data I thing there will be line chart ...  
First I recommend to reduce the amount of data you are trying to send to chart. You probably will kill the browser with that many entries.

Show what you try to do in the function just before the chart.

---

<div class="post-metadata">

**Author:** ![Silver](https://avatars.discourse-cdn.com/v4/letter/s/a3d4f5/32.png) [@Silver](https://discourse.nodered.org/u/Silver)\
**Post date:** [2 December 2020 13:58 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/3 "2020-12-02T13:58:06Z")

</div>

Hi there, I tried to filter through the array with a for loop, but I had absolutely no idea where to send the data too, ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/0/10fbdc0095ec45e9d89207b5ca087e0e2765bf8a.png)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [2 December 2020 14:14 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/4 "2020-12-02T14:14:55Z")

</div>

To show historical data, the chart requires the data be formatted in certain way.

> <https://github.com/node-red/node-red-dashboard/blob/master/Charts.md#line-charts-1>

You have data for one series so the payload to send to chart should be like this:

```auto
[{
"series": ["A"],
"data": [
    [
     { "x": 1504029632890, "y": 5 },
     { "x": 1504029636001, "y": 4 },
     { "x": 1504029638656, "y": 2 }
    ]
],
"labels": [""]
}]

```

The data object is an array of series  
The series is an array of objects  
Those objects have properties x (timestamp) and y (value)

Your data is already an array of objects but the property names are wrong for chart  
So that needs to be changed

> <https://stackoverflow.com/questions/52106582/javascript-how-can-i-change-property-names-of-objects-in-an-array/52106745#52106745>

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [2 December 2020 14:21 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/5 "2020-12-02T14:21:26Z")

</div>

You could use [this solution](https://discourse.nodered.org/t/dynamic-series-identification-from-message-send-data-to-chart/36682/5) as a starting point.

PS, use TOP or LIMIT clause in your query (rather than bringing 50000+ records to node-red, just limit the data coming from the database)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [1 January 2021 14:21 UTC](https://discourse.nodered.org/t/reading-from-an-array-into-a-chart/36874/6 "2021-01-01T14:21:28Z")

</div>

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