# Data from mySQL to Chart

**URL:** https://discourse.nodered.org/t/data-from-mysql-to-chart/11437
**Category:** General
**Created:** [22 May 2019 19:34 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437 "2019-05-22T19:34:22Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![hunterhb](https://avatars.discourse-cdn.com/v4/letter/h/a3d4f5/32.png) [@hunterhb](https://discourse.nodered.org/u/hunterhb)
#### Post date: [22 May 2019 19:34 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/1 "2019-05-22T19:34:22Z")

</div>

Hello,  
I'm trying to visualize sql-Data in a Chart node.  
I got Data from Database as follow:

22.5.2019, 21:16:19[node: b3d00608.8d4658](http://192.168.178.45:1880/#)SELECT Datum, T1, T2, T3, T4 FROM tb\_Pool WHERE DATE(Datum) \>= '2019-04-30' AND DATE(Datum) \<= '2019-04-30' : msg : Object

object

payload: array[3]

0: object

Datum: "2019-04-30T20:32:21.000Z"

T1: 24.5

T2: 24.6

T3: 41.1

T4: 40.4

1: object

Datum: "2019-04-30T21:05:31.000Z"

T1: 24.3

T2: 24.3

T3: 27.8

T4: 40.4

2: object

Datum: "2019-04-30T21:35:37.000Z"

T1: 24.1

T2: 24.1

T3: 26.3

T4: 40.4

topic: "SELECT Datum, T1, T2, T3, T4 FROM tb\_Pool WHERE DATE(Datum) \>= '2019-04-30' AND DATE(Datum) \<= '2019-04-30'"

I developed this function to see T1 in the Chart:

var newMsg = {};  
newMsg.payload = [{  
key: "Temperatur",  
values:   
}];  
for (i = 0; i \< msg.payload.length; i++) {  
newMsg.payload[0].values.push(  
[(msg.payload[i].Datum),  
msg.payload[i].T1]);  
}  
msg = newMsg;  
return msg;

The Chart get the data like this:

22.5.2019, 21:16:19[node: c10c96e4.9419e8](http://192.168.178.45:1880/#)msg : Object

object

payload: array[1]

0: object

key: "Temperatur"

values: array[3]

0: array[2]

0: "2019-04-30T20:32:21.000Z"

1: 24.5

1: array[2]

0: "2019-04-30T21:05:31.000Z"

1: 24.3

2: array[2]

0: "2019-04-30T21:35:37.000Z"

1: 24.1

\_msgid: "35ade565.76b63a"

Now I see only a straight line on 25°C?

Could someone help me?

Thank you.

---

<div class="post-metadata">

### Author: ![hunterhb](https://avatars.discourse-cdn.com/v4/letter/h/a3d4f5/32.png) [@hunterhb](https://discourse.nodered.org/u/hunterhb)
#### Post date: [22 May 2019 19:45 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/2 "2019-05-22T19:45:51Z")

</div>

Sorry,

but I got the right data in the chart, but you can't see it if it's 24,1°C or 24,5°C.  
You get the right value if you hover over the point an get a hint of the value.  
Can I adjust the solution of the y-Axis?

---

<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: [22 May 2019 20:07 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/3 "2019-05-22T20:07:48Z")

</div>

Not sure what you mean, can you post an image showing the problem?

---

<div class="post-metadata">

### Author: ![hunterhb](https://avatars.discourse-cdn.com/v4/letter/h/a3d4f5/32.png) [@hunterhb](https://discourse.nodered.org/u/hunterhb)
#### Post date: [23 May 2019 19:30 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/4 "2019-05-23T19:30:10Z")

</div>

Hello,

I have following UI:

 ![History-Chart](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/d/dc672969c42496bb19cc8b82907826bea5fa6046.jpeg)

The charts in the middle get the data from mySql-Database.  
Now I want to show all 4 lines in the right chart.  
I try this wit a function Node with following source code:  
The example is only with two temperatures.

```auto
var msg1 = {};
var msg2 = {};
msg1.payload = [{
    key: "Temperatur1",
    values: []
}];
msg2.payload = [{
    key: "Temperatur2",
    values: []
}];
for (i = 0; i < msg.payload.length; i++) {
    msg1.payload[0].values.push(
        [msg.payload[i].Datum, 
        msg.payload[i].T1]);
    msg2.payload[0].values.push(
        [msg.payload[i].Datum,
        msg.payload[i].T2]);
}
msg1.topic = 'T1 Vorlauf';
msg2.topic = 'T2 Rücklauf';

return [msg1, msg2];

```

But the chart will shown only the line with topic T2 Rücklauf?  
The function node has 2 outputs. Both are connectet with the chart.  
What is my fault?

Thanks for your help.

---

<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: [23 May 2019 19:47 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/5 "2019-05-23T19:47:29Z")

</div>

Put a debug node showing the messages going to the chart and see what it says. Show us if it looks ok to you.

---

<div class="post-metadata">

### Author: ![hunterhb](https://avatars.discourse-cdn.com/v4/letter/h/a3d4f5/32.png) [@hunterhb](https://discourse.nodered.org/u/hunterhb)
#### Post date: [23 May 2019 19:53 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/6 "2019-05-23T19:53:14Z")

</div>

I get two messages with topic T1 and topic T2.  
Both messages includes the right data arrays (temperatures) in payload.

23.5.2019, 21:49:41node: c10c96e4.9419e8  
T1 Vorlauf : msg : Object  
object  
payload: array[1]  
0: object  
topic: "T1 Vorlauf"  
\_msgid: "479c0d1a.beecf4"  
23.5.2019, 21:49:42node: c10c96e4.9419e8  
T2 Rücklauf : msg : Object  
object  
payload: array[1]  
topic: "T2 Rücklauf"  
\_msgid: "479c0d1a.beecf4"

The arrays looks like that:

payload: array[1]  
0: object  
key: "Temperatur1"  
values: array[4]  
0: array[2]  
0: "2019-05-23T18:14:08.000Z"  
1: 25.4  
1: array[2]  
0: "2019-05-23T18:30:03.000Z"  
1: 25.6  
2: array[2]  
0: "2019-05-23T19:00:03.000Z"  
1: 25.7  
3: array[2]  
0: "2019-05-23T19:30:03.000Z"  
1: 25.5

---

<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: [23 May 2019 20:03 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/7 "2019-05-23T20:03:28Z")

</div>

Are you trying to add new values to the chart as they arrive, or fill the complete chart in one go?  
If the former then you just need to send messages each with a topic and value (no time, it is assumed that the time is the current time).  
If the latter then see this for how to format one message containing all the lines

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

---

<div class="post-metadata">

### Author: ![hunterhb](https://avatars.discourse-cdn.com/v4/letter/h/a3d4f5/32.png) [@hunterhb](https://discourse.nodered.org/u/hunterhb)
#### Post date: [23 May 2019 20:10 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/8 "2019-05-23T20:10:53Z")

</div>

That is what I do when I want to show live Data.  
But I fill every chart in the middle with datasets from database.  
msg.payload is the result from the SQL-statement.

```auto
for (i = 0; i < msg.payload.length; i++) {
    msg1.payload[0].values.push(
        [msg.payload[i].Datum, 
        msg.payload[i].T1]);

```

So I do with every chart in the middle and that work fine.  
But how can I merge all 4 lines in one chart?

---

<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: [23 May 2019 20:28 UTC](https://discourse.nodered.org/t/data-from-mysql-to-chart/11437/9 "2019-05-23T20:28:29Z")

</div>

I am surprised that what you have described works correctly. For multiple lines I believe you have to format it as in the link I posted (in the Stored Data section, Line Charts).
