# One chart for multiple data arrays \> context vs sqlite

**URL:** <https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032>\
**Category:** General\
**Created:** [28 March 2023 23:17 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032 "2023-03-28T23:17:05Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Vilnis\_R](https://avatars.discourse-cdn.com/v4/letter/v/a183cd/32.png) [@Vilnis\_R](https://discourse.nodered.org/u/Vilnis_R)\
**Post date:** [28 March 2023 23:17 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032/1 "2023-03-28T23:17:05Z")

</div>

Hi!

I am intended to use one chart node for multiple (10) data arrays instead of making 10 chart nodes. Idea is to click on button that points to the particular data array and then it loads into the chart.

Therefore I have 2 questions:

1. what would better (loading time & complexity) approach - storing chart data into 10 context flows or selecting data from sqlite database from 10 tables. My single chart array consists of around 1000 data points/entries, not more.
2. if I use chart node it can make nice context flow of desired time period/or points. However if I use only one chart for the purpose I need to produce this array by function code I suppose. Are there any function examples that generates such data array for the simple one line chart.  
Before this I used to use number of charts and then hiding and unhiding them by clicking on buttons. however this makes a lot of nodes in my flow.

---

<div class="post-metadata">

**Author:** ![jbudd](https://avatars.discourse-cdn.com/v4/letter/j/5f8ce5/32.png) [@jbudd](https://discourse.nodered.org/u/jbudd)\
**Post date:** [29 March 2023 00:28 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032/2 "2023-03-29T00:28:27Z")

</div>

> [@Vilnis\_R](#):
>
> Are there any function examples that generates such data array for the simple one line chart.

Here is a flow which shows one of two charts according to button clicks:

 ![Untitled 3](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/3/63655e66dc0122f54117f1eb4678e90ce962a0d4.jpeg)

```auto
[{"id":"63e32070dcc833f1","type":"tab","label":"Flow 2","disabled":false,"info":"","env":[]},{"id":"b8d3d59af4f88770","type":"function","z":"63e32070dcc833f1","name":"reformat","func":"let chart = [{\n \"series\": [msg.linetype],\n \"data\": [\n msg.payload.map(d => { return { x: d.timestamp, y: d.value } })\n],\n \"labels\": []\n}];\nmsg.payload = chart\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":460,"y":120,"wires":[["f909346a2518cc64"]]},{"id":"f909346a2518cc64","type":"ui_chart","z":"63e32070dcc833f1","name":"Chart","group":"e28f8d1f74fdc75d","order":8,"width":"10","height":"5","label":"{{linetype}}","chartType":"line","legend":"true","xformat":"auto","interpolate":"bezier","nodata":"No Data","dot":false,"ymin":"","ymax":"","removeOlder":"4","removeOlderPoints":"1000","removeOlderUnit":"604800","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#bf0000","#009500","#005fbd","#c0c0c0","#98df8a","#ff9797","#97cbff","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"className":"","x":650,"y":120,"wires":[[]]},{"id":"36e0cd863925046a","type":"change","z":"63e32070dcc833f1","name":"Fetch Density Data","rules":[{"t":"set","p":"payload","pt":"msg","to":"[{\"timestamp\":\"2023-03-01T12:00:00.000Z\",\"value\":17},{\"timestamp\":\"2023-03-02T12:00:00.000Z\",\"value\":12},{\"timestamp\":\"2023-03-03T12:00:00.000Z\",\"value\":19.3},{\"timestamp\":\"2023-03-04T12:00:00.000Z\",\"value\":18.04},{\"timestamp\":\"2023-03-05T12:00:00.000Z\",\"value\":10}]","tot":"json"},{"t":"set","p":"linetype","pt":"msg","to":"Drill Mud Density","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":270,"y":100,"wires":[["b8d3d59af4f88770"]]},{"id":"e0c93a03eb6e2063","type":"change","z":"63e32070dcc833f1","name":"Fetch Depth Data","rules":[{"t":"set","p":"payload","pt":"msg","to":"[{\"timestamp\":\"2023-03-01T12:00:00.000Z\",\"value\":-417.8},{\"timestamp\":\"2023-03-02T12:00:00.000Z\",\"value\":-419.3},{\"timestamp\":\"2023-03-03T12:00:00.000Z\",\"value\":-419.3},{\"timestamp\":\"2023-03-04T12:00:00.000Z\",\"value\":-420.1},{\"timestamp\":\"2023-03-05T12:00:00.000Z\",\"value\":-427.85}]","tot":"json"},{"t":"set","p":"linetype","pt":"msg","to":"Drill Depth","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":270,"y":140,"wires":[["b8d3d59af4f88770"]]},{"id":"e00e4cf6fa469815","type":"ui_button","z":"63e32070dcc833f1","name":"","group":"e28f8d1f74fdc75d","order":1,"width":"3","height":"1","passthru":false,"label":"Density","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"go","payloadType":"str","topic":"topic","topicType":"msg","x":100,"y":40,"wires":[["815b903a5be9574e"]]},{"id":"815b903a5be9574e","type":"trigger","z":"63e32070dcc833f1","name":"","op1":"[]","op2":"0","op1type":"json","op2type":"str","duration":"250","extend":false,"overrideDelay":false,"units":"ms","reset":"","bytopic":"all","topic":"topic","outputs":2,"x":260,"y":40,"wires":[["f909346a2518cc64"],["36e0cd863925046a"]]},{"id":"8ac5b84fcaa14c42","type":"ui_button","z":"63e32070dcc833f1","name":"","group":"e28f8d1f74fdc75d","order":1,"width":"3","height":"1","passthru":false,"label":"Depth","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"go","payloadType":"str","topic":"topic","topicType":"msg","x":110,"y":200,"wires":[["f2029c7f5f90059c"]]},{"id":"f2029c7f5f90059c","type":"trigger","z":"63e32070dcc833f1","name":"","op1":"[]","op2":"0","op1type":"json","op2type":"str","duration":"250","extend":false,"overrideDelay":false,"units":"ms","reset":"","bytopic":"all","topic":"topic","outputs":2,"x":260,"y":200,"wires":[["f909346a2518cc64"],["e0c93a03eb6e2063"]]},{"id":"e28f8d1f74fdc75d","type":"ui_group","name":"Demo","tab":"45fe9c032a4d03ad","order":1,"disp":true,"width":"10","collapse":false,"className":""},{"id":"45fe9c032a4d03ad","type":"ui_tab","name":"Demo","icon":"","disabled":false,"hidden":false}]

```

 ![Untitled 5](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/8/48f32b94050a16589c0236d02cbbb273a39b44b0.jpeg)

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [29 March 2023 01:21 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032/3 "2023-03-29T01:21:36Z")

</div>

pls go through this topic, you may get some insights

> [@Cannot "unhide" dashboard chart lines](https://discourse.nodered.org/t/cannot-unhide-dashboard-chart-lines/73066):
>
> I am hiding selected lines on a chart (by nullifying that element of the chart data array and redrawing) This works, and I can have a Reset button to redraw all the lines. Except... If I hide all the lines on the chart, I can't unhide them without reloading the page. Any ideas why not? (Sorry the Gif is a big file, don't know the right way to record the screen for posting) [Animation] [{"id":"30306197ead446be","type":"tab","label":"Flow 4","disabled":false,"info":"","env":[]…

---

<div class="post-metadata">

**Author:** ![Vilnis\_R](https://avatars.discourse-cdn.com/v4/letter/v/a183cd/32.png) [@Vilnis\_R](https://discourse.nodered.org/u/Vilnis_R)\
**Post date:** [29 March 2023 15:46 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032/4 "2023-03-29T15:46:00Z")

</div>

Thanks! Great example of Yours. I just figured out a little different solution that might be ok too.  
I am storing all the incoming data for each chart in the separate flow contexts. Contexts are stored in the file so it prevents from blackout when node red is restarting. On the restart chart will load last known click data array.  
Then I made function node that is triggered either by incoming data or click message. Function then selects appropriate context and pass to the chart so my chart gets data only from context, not from the the data flow directly. Lets see how it will behave in the long run.

---

<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:** [28 May 2023 15:46 UTC](https://discourse.nodered.org/t/one-chart-for-multiple-data-arrays-context-vs-sqlite/77032/5 "2023-05-28T15:46:48Z")

</div>

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