# Create a graph from csv with time and 6 columns

**URL:** <https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960>\
**Category:** Dashboard\
**Created:** [8 April 2022 00:13 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960 "2022-04-08T00:13:14Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![peterblue22](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/peterblue22/32/59753_2.png) [@peterblue22](https://discourse.nodered.org/u/peterblue22)\
**Post date:** [8 April 2022 00:13 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/1 "2022-04-08T00:13:14Z")

</div>

Hello All!  
I'm trying to create a graph from a CSV file below is the flow I have:

The CSV is very simple, one column with time and 6 columns with data. However, I'm not able to display anything in the graph. What I'm doing wrong? Thank you so much.

CSV sample data:

TIME,IA,IB,IC,VA,VB,VC  
09:21.3,-3.984,2.188,1.563,-0.165,0.105,0.057  
09:21.3,-3.984,1.406,2.266,-0.169,0.077,0.089  
09:21.3,-3.75,0.703,2.734,-0.161,0.045,0.111

```auto
[
    {
        "id": "ececab80965a5f13",
        "type": "tab",
        "label": "graph csv",
        "disabled": false,
        "info": ""
    },
    {
        "id": "5e2714570cd93537",
        "type": "inject",
        "z": "ececab80965a5f13",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "start",
        "payload": "1",
        "payloadType": "num",
        "x": 150,
        "y": 80,
        "wires": [
            [
                "92d76645c7b27a3a"
            ]
        ]
    },
    {
        "id": "f62c08cb2bed5705",
        "type": "debug",
        "z": "ececab80965a5f13",
        "name": "",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "statusVal": "",
        "statusType": "auto",
        "x": 770,
        "y": 160,
        "wires": []
    },
    {
        "id": "92d76645c7b27a3a",
        "type": "file in",
        "z": "ececab80965a5f13",
        "name": "",
        "filename": "C:\\Users\\user\\Documents\\yesid1.csv",
        "format": "utf8",
        "chunk": false,
        "sendError": false,
        "encoding": "none",
        "allProps": false,
        "x": 330,
        "y": 160,
        "wires": [
            [
                "3c839915820df949",
                "f62c08cb2bed5705"
            ]
        ]
    },
    {
        "id": "3c839915820df949",
        "type": "csv",
        "z": "ececab80965a5f13",
        "name": "",
        "sep": ",",
        "hdrin": true,
        "hdrout": "",
        "multi": "mult",
        "ret": "\\n",
        "temp": "",
        "skip": "0",
        "strings": true,
        "include_empty_strings": false,
        "include_null_values": false,
        "x": 310,
        "y": 280,
        "wires": [
            [
                "88f2e89168793a99",
                "f62c08cb2bed5705"
            ]
        ]
    },
    {
        "id": "88f2e89168793a99",
        "type": "function",
        "z": "ececab80965a5f13",
        "name": "graph generate",
        "func": "var payload=msg.payload;\n\nvar a1=[];\nvar a2=[];\nvar a3=[];\nvar a4=[];\nvar a5=[];\nvar a6=[];\n\nfor(let i=0;i<payload.length;i++)\n{\nvar timep=(payload[i][\"TIME\"]);\nvar temp1={\"x\": time, \"y\": parseInt(payload[i][\"A\"])};\nvar temp2={\"x\": time, \"y\": parseInt(payload[i][\"B\"])};\nvar temp3={\"x\": time, \"y\": parseInt(payload[i][\"C\"])};\nvar temp4={\"x\": time, \"y\": parseInt(payload[i][\"D\"])};\nvar temp5={\"x\": time, \"y\": parseInt(payload[i][\"E\"])};\nvar temp6={\"x\": time, \"y\": parseInt(payload[i][\"F\"])};\n\na1.push(temp1);\na2.push(temp2);\na3.push(temp3);\na4.push(temp4);\na5.push(temp5);\na6.push(temp6);\n \n \n //\n \n \n}\n\ndata_out=[a1,a2,a3,a4,a5,a6];\nmsg.payload=[{\n\"series\": [\"A\",\"B\",\"C\",\"D\",\"E\",\"F\"],\n\"DATA\":data_out,\n\"labels\": [\"A\",\"B\",\"C\",\"D\",\"E\",\"F\"]\n}];\n\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 340,
        "y": 480,
        "wires": [
            [
                "f62c08cb2bed5705",
                "aec05244f53c2688"
            ]
        ]
    },
    {
        "id": "aec05244f53c2688",
        "type": "ui_chart",
        "z": "ececab80965a5f13",
        "name": "",
        "group": "2ac8e3fa.8b8584",
        "order": 5,
        "width": 0,
        "height": 0,
        "label": "Time Graph Test",
        "chartType": "line",
        "legend": "true",
        "xformat": "HH:mm:ss",
        "interpolate": "linear",
        "nodata": "",
        "dot": false,
        "ymin": "",
        "ymax": "",
        "removeOlder": 1,
        "removeOlderPoints": "",
        "removeOlderUnit": "3600",
        "cutout": 0,
        "useOneColor": false,
        "useUTC": false,
        "colors": [
            "#400000",
            "#ff8000",
            "#ff7f0e",
            "#2ca02c",
            "#98df8a",
            "#d62728",
            "#ff9896",
            "#9467bd",
            "#c5b0d5"
        ],
        "outputs": 1,
        "useDifferentColor": false,
        "className": "",
        "x": 720,
        "y": 380,
        "wires": [
            [
                "f62c08cb2bed5705"
            ]
        ]
    },
    {
        "id": "2ac8e3fa.8b8584",
        "type": "ui_group",
        "name": "Default",
        "tab": "ebb1ed1c.5ebe2",
        "order": 1,
        "disp": true,
        "width": "12",
        "collapse": false,
        "className": ""
    },
    {
        "id": "ebb1ed1c.5ebe2",
        "type": "ui_tab",
        "name": "Home",
        "icon": "dashboard",
        "disabled": false,
        "hidden": false
    }
]

```

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [8 April 2022 06:32 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/2 "2022-04-08T06:32:15Z")

</div>

May I suggest you start with first establishing the chart plotting the data.

Get the `chart` node and connect two `inject` nodes into it.

In the first `inject` node copy/paste the first line (from what you posted) `09:21.3,-3.984,2.188,1.563,-0.165,0.105,0.057`  
and in the second node put the second line.

`DEPLOY` it then press the buttons to inject the two lines of data and see what you see.

Report back when done and we can move from there.

But also - in passing - I see you are using windows.  
It has been a LONG TIME since I used it but this is ringing alarm bells for not looking right:  
`"filename": "C:\\Users\\user\\Documents\\yesid1.csv",`

I may be wrong - and usually am - but I thought I would mention it.

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [8 April 2022 06:40 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/3 "2022-04-08T06:40:40Z")

</div>

Your function has some typo's and the TIME data needs to be a timestamp, so needs converting  
here is an example

```auto
[{"id":"645ff7dc.625cc8","type":"template","z":"bf9e1e33.030598","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"TIME,IA,IB,IC,VA,VB,VC\n09:21.3,-3.984,2.188,1.563,-0.165,0.105,0.057\n09:22.3,-3.984,1.406,2.266,-0.169,0.077,0.089\n09:23.3,-3.75,0.703,2.734,-0.161,0.045,0.111\n","output":"str","x":350,"y":2920,"wires":[["3fc27f3d.c0102"]]},{"id":"3fc27f3d.c0102","type":"csv","z":"bf9e1e33.030598","name":"","sep":",","hdrin":true,"hdrout":"","multi":"mult","ret":"\\n","temp":"","skip":"0","strings":true,"include_empty_strings":false,"include_null_values":false,"x":500,"y":2920,"wires":[["cad4c1f8.ea263"]]},{"id":"756d43fa.c8ddfc","type":"inject","z":"bf9e1e33.030598","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"start","payload":"1","payloadType":"num","x":200,"y":2920,"wires":[["645ff7dc.625cc8"]]},{"id":"cad4c1f8.ea263","type":"function","z":"bf9e1e33.030598","name":"graph generate","func":"let payload=msg.payload;\n\nlet data = [[],[],[],[],[],[]];\nfor(let i=0;i<payload.length;i++){\n let time = payload[i].TIME.split(\".\");\n time[1] = time[1].padStart(2,\"0\");\n time = time.join(\":\");\n time = new Date(\"1970-01-01T\"+time);\n data[0].push({\"x\": time, \"y\": payload[i].IA});\n data[1].push({\"x\": time, \"y\": payload[i].IB});\n data[2].push({\"x\": time, \"y\": payload[i].IC});\n data[3].push({\"x\": time, \"y\": payload[i].VA});\n data[4].push({\"x\": time, \"y\": payload[i].VB});\n data[5].push({\"x\": time, \"y\": payload[i].VC});\n}\nlet labels = msg.columns.split(\",\").slice(1);\n\nmsg.payload=[{\n\"series\": labels,\n\"data\":data,\n\"labels\": labels\n}];\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":690,"y":2920,"wires":[["6b7aa11a.55a6f","9ad4c905.297688"]]},{"id":"6b7aa11a.55a6f","type":"ui_chart","z":"bf9e1e33.030598","name":"","group":"c74b14d2.15e9f8","order":5,"width":0,"height":0,"label":"Time Graph Test","chartType":"line","legend":"true","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":1,"removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#400000","#ff8000","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"className":"","x":940,"y":2920,"wires":[[]]},{"id":"9ad4c905.297688","type":"debug","z":"bf9e1e33.030598","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":960,"y":2800,"wires":[]},{"id":"c74b14d2.15e9f8","type":"ui_group","name":"Default","tab":"ebb1ed1c.5ebe2","order":1,"disp":true,"width":"12","collapse":false,"className":""},{"id":"ebb1ed1c.5ebe2","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

I have simulated your file read node with a template, so just replace the template node.  
[edit] fixed padding in time string

---

<div class="post-metadata">

**Author:** ![peterblue22](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/peterblue22/32/59753_2.png) [@peterblue22](https://discourse.nodered.org/u/peterblue22)\
**Post date:** [8 April 2022 13:32 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/4 "2022-04-08T13:32:07Z")

</div>

I got it! Thank you so much E1cid

---

<div class="post-metadata">

**Author:** ![king](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/king/32/61915_2.png) [@king](https://discourse.nodered.org/u/king)\
**Post date:** [9 April 2022 13:49 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/5 "2022-04-09T13:49:53Z")

</div>

Please help, the csv file is read and transferred to the dashboard

AGVName,Date,Time,B1C1,B1C2,B1Temp,Current,SOC  
107102,2022/2/8,00:04.8,3.427,3.477,33,192.7,61  
107102,2022/2/8,00:11.7,3.449,3.503,33,193.2,61  
107102,2022/2/8,00:18.5,3.466,3.524,33,192.9,62  
107102,2022/2/8,00:25.3,3.474,3.536,33,192.7,62  
107102,2022/2/8,00:32.2,3.481,3.545,33,193,62  
107102,2022/2/8,00:39.0,3.361,3.384,33,-20.9,63  
107102,2022/2/8,00:45.9,3.341,3.365,33,-13.8,63  
107102,2022/2/8,00:52.7,3.326,3.343,33,-14.2,63  
107102,2022/2/8,00:59.6,3.312,3.326,33,-14.7,63  
107102,2022/2/8,01:06.5,3.306,3.313,33,-13.8,63  
107102,2022/2/8,01:13.3,3.299,3.305,33,-15.9,63  
107102,2022/2/8,01:20.2,3.291,3.291,33,-18.9,63  
107102,2022/2/8,01:27.0,3.286,3.283,33,-15.7,63  
107102,2022/2/8,01:33.9,3.288,3.284,33,-13.4,63  
107102,2022/2/8,01:40.7,3.288,3.283,33,-12.4,63  
107102,2022/2/8,01:47.6,3.281,3.27,33,-19.9,63  
107102,2022/2/8,01:54.5,3.279,3.267,33,-17.1,63  
107102,2022/2/8,02:01.3,3.278,3.265,33,-17.7,63  
107102,2022/2/8,02:08.1,3.276,3.262,33,-19.1,63  
107102,2022/2/8,02:15.0,3.276,3.262,33,-16.3,63  
107102,2022/2/8,02:22.6,3.279,3.267,33,-13.2,63  
107102,2022/2/8,02:29.4,3.278,3.265,33,-13.8,63  
107102,2022/2/8,02:36.3,3.278,3.267,33,-12.8,63  
107102,2022/2/8,02:43.1,3.277,3.264,33,-14,63  
107102,2022/2/8,02:50.0,3.277,3.264,33,-14,63  
107102,2022/2/8,02:56.8,3.276,3.263,33,-12.2,63  
107102,2022/2/8,03:03.7,3.279,3.267,33,-11.4,63  
107102,2022/2/8,03:10.5,3.267,3.248,33,-10.2,63  
107102,2022/2/8,03:17.3,3.277,3.265,33,-10.4,63  
107102,2022/2/8,03:24.2,3.277,3.265,33,-10,63  
107102,2022/2/8,03:31.0,3.269,3.254,33,-20.9,63  
107102,2022/2/8,03:37.8,3.272,3.257,33,-16.9,63  
107102,2022/2/8,03:44.6,3.273,3.259,33,-14.2,63  
107102,2022/2/8,03:51.5,3.268,3.252,33,-22.4,63

---

<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:** [23 April 2022 13:50 UTC](https://discourse.nodered.org/t/create-a-graph-from-csv-with-time-and-6-columns/60960/6 "2022-04-23T13:50:18Z")

</div>

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