# Line chart problems with X and Y axis

**URL:** <https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488>\
**Category:** Dashboard\
**Created:** [29 June 2022 08:17 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488 "2022-06-29T08:17:29Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![alberparri](https://avatars.discourse-cdn.com/v4/letter/a/8797f3/32.png) [@alberparri](https://discourse.nodered.org/u/alberparri)\
**Post date:** [29 June 2022 08:17 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/1 "2022-06-29T08:17:29Z")

</div>

Hi

I try to get a chart with the parameters I receive via UDP. The parameters are like '16,1.23'. The first is a time, and the second, a voltage. The first should be the X axis, and the second, the Y axis  
i have created this function:

dato = msg.payload.split(",");  
var time = dato[0];  
var voltage = dato[1];  
if(time == "+++"){  
time = 0;  
voltage = 1;  
}  
var xydata=;  
var dat = {x:time,y:voltage}  
xydata.push(dat);  
msg.payload=[{  
"series": ["voltage"],  
"data": [xydata],  
"labels": [""]  
}];  
return msg;

And the debug message of each of the couples of data received is like this:

29/6/2022, 10:02:23[node: msg debug]  
msg : Object  
object  
payload: array[1]  
0: object  
series: array[1]  
data: array[1]  
0: array[1]  
0: object  
x: "2108"  
y: "0.9959"  
labels: array[1]  
fromip: "xxxxxxxxxxxxx"  
ip: "xxxxxxxxxxxxx"  
port: xxxxxxx  
\_msgid: "5a883c89.8398d4"

So everything seems OK in the debug, but the chart is completelly EMPTY (the '+++' is the end of the received packets). The variable 'time' comes from 0 to XXXXX, and it is and integer.

Any idea why it doesn't work?

Thanks

---

<div class="post-metadata">

**Author:** ![alberparri](https://avatars.discourse-cdn.com/v4/letter/a/8797f3/32.png) [@alberparri](https://discourse.nodered.org/u/alberparri)\
**Post date:** [29 June 2022 09:25 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/2 "2022-06-29T09:25:07Z")

</div>

I think, my problem is that the objects are passed to the chart node as characters instead of numbers:  
x: "2108"  
y: "0.9959"  
I store all the received datas in a csv file and when I send it to the chart node, the parameters are without "", and they are represented correctly.  
How can I send the datas without the ""?

Thanks

---

<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:** [29 June 2022 09:32 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/3 "2022-06-29T09:32:55Z")

</div>

> [@alberparri](#):
>
> var time = dato[0];  
> var voltage = dato[1];

```auto
var time = parseInt(dato[0]);//integer
var voltage = parseFloat(dato[1]);//floating point number

```

---

<div class="post-metadata">

**Author:** ![alberparri](https://avatars.discourse-cdn.com/v4/letter/a/8797f3/32.png) [@alberparri](https://discourse.nodered.org/u/alberparri)\
**Post date:** [29 June 2022 10:04 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/4 "2022-06-29T10:04:17Z")

</div>

Thanks

I have do that and now, the parameters are passed to the chart without "":  
x: 4432  
y: 0.3212

But the result is the same, so it is not a problem of character/number.

Any other idea?

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [29 June 2022 10:24 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/5 "2022-06-29T10:24:34Z")

</div>

> [@alberparri](#):
>
> data: array[1]  
> 0: array[1]  
> 0: object  
> x: "2108"  
> y: "0.9959"

As shown you are only sending a single point to the chart, which may not be easy to see. You must either build up the complete set of points before sending it to the chart or you can, I think, send them one at a time in the format  
`{topic:"temperature", payload:22, timestamp:1520527095000}`  
as described in [node-red-dashboard/Charts.md at master · node-red/node-red-dashboard · GitHub](https://github.com/node-red/node-red-dashboard/blob/master/Charts.md). I think that works for non-time series data, but I have not tried it.

---

<div class="post-metadata">

**Author:** ![alberparri](https://avatars.discourse-cdn.com/v4/letter/a/8797f3/32.png) [@alberparri](https://discourse.nodered.org/u/alberparri)\
**Post date:** [29 June 2022 10:39 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/6 "2022-06-29T10:39:12Z")

</div>

No, I am receiving a data (time,voltage) every 4 ms and I send then to the chart in the moment they are received, like this:

0,1.234  
4,1.444  
8,2.345  
.....  
2108,0.9959  
.....  
and so on.

Sorry, I am very new in node red and I don't know how to write in the function node what you see about  
{topic:"temperature", payload:22, timestamp:1520527095000}

Is it anything like this?  
msg.topic = {payload:22,timestamp:1520527095000}

---

<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:** [29 June 2022 11:01 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/7 "2022-06-29T11:01:43Z")

</div>

Line charts are meant to display time-series type of data. There is 2 ways the data can be shown.

1. Live - the payload is single value. The timestamp is created automatically at the moment the chart receives the value.
2. Historical - the payload contains an array of data points

```auto
// an array of objects where x is timestamp and y is value
var data = [
    {x:123456,y:55},
    {x:123567,y:59},
    {x:123678,y:43},
]

```

Actual format of historical data is a bit more complicated.

You are trying to do something in between. Having both - timestamp and value but feeding data to chart as for Live charting.

That's no go. You need to choose one or other way and then even format your data properly or for live chart, just feed the values.

> [@alberparri](#):
>
> every 4 ms

That will be way too fast for chart. I'll end up with unresponsive dashboard very quickly.

---

<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:** [29 July 2022 11:02 UTC](https://discourse.nodered.org/t/line-chart-problems-with-x-and-y-axis/64488/8 "2022-07-29T11:02:29Z")

</div>

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