Problem with line chart

Good day!
I try to visualize data from Cloudant with Line Chart.
Function code is:

var time = [];
var temp = [];
var deviceid = [];
var time_float = 0;
var temp_float = 0;

var i = 0;
var dataarray = [[]];

for (i=0; i < msg.payload.length; i++) {
time = msg.payload[i].data.d.timestamp;
temp =  msg.payload[i].data.d.value3;
time_float = Date.parse(time);
temp_float = temp;
dataarray[0][i] = {"x":time_float,"y":temp_float};
}
var chart = [{
    "series":["Temperature ="],
    "data":dataarray,
    "labels":[""]
}];
msg.payload = chart;
return msg;

Into UI my chart's dots connected chaotically
chart

Where is my mistake?

Thanks a lot!

The points will be plotted in the order that they are in the array. The chart looks as if the samples are not in timestamp order, so the line flicks up and down. So for example the first sample might be 13:13, then the next at 14:00, then the next at 13:30 and so on. I don't know about Cloudant, but perhaps you have to ask for the data to be sorted by the timestamp column when you fetch it.

1 Like

Thanks a lot! I understand this.
How can I sort array of objects? I cant find information about this.
Field "X" is my timestamp, field "Y" - data for visualize.

It would be much more efficient to sort it when you fetch it from Cloudant rather than sorting it in node-red. A quick google search gave many hits including https://stackoverflow.com/questions/40624834/how-to-sort-date-in-cloudant-query

If you really need to sort it in node red then you can do it in javascript using the javascript sort() function. This link has an example of how to do it in the section Sorting Object Arrays. https://www.w3schools.com/js/js_array_sort.asp

1 Like

Thanks a lot!

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