# Sorting the Bars of a Bar Chart

**URL:** <https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809>\
**Category:** Dashboard\
**Created:** [27 August 2019 03:17 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809 "2019-08-27T03:17:50Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![lineal](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@lineal](https://discourse.nodered.org/u/lineal)\
**Post date:** [27 August 2019 03:17 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/1 "2019-08-27T03:17:51Z")

</div>

Hi.  
I am using a slightly modified version of node-red in something called LoopEdge/LoopFlows but I believe it works in the same way as usual node-red.

I have a bar chart and I was wondering, is there any way I could order the bars so they appear in the same order each time? (D20...D24)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b8c86a0780d94f70b574a0563d1db950bac7fbfa.png)

This is my flow right now:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b5568af9c5a4004e772574d802924dc276629c56.png)  
At the moment, the bars on the chart appear as each device connects, which happens in a random order... I'm not sure if regular node-red has the green nodes, but after they connect, they pass JSON to my function, which extracts values as msg.payload and msg.topic, and sends it to the chart.

I'm not sure if this is even possible to do because of the way the data appears.

Sorry if this is difficult to understand. I'm not very knowledgeable about node-red... can anybody tell me what might be a solution?

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [27 August 2019 06:03 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/2 "2019-08-27T06:03:09Z")

</div>

The chart node contains information how to format the data you want.

> Inputting a `msg.payload` containing a blank array `[]` will clear the chart.  
> See **[this information](https://github.com/node-red/node-red-dashboard/blob/master/Charts.md)** for how to pre-format data to be passed in as a complete chart.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [27 August 2019 06:45 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/3 "2019-08-27T06:45:43Z")

</div>

The easiest way is to to send one set of dummy data in the correct order at start time, so when real data arrives the chart is ready..

---

<div class="post-metadata">

**Author:** ![ukmoose](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ukmoose/32/13_2.png) [@ukmoose](https://discourse.nodered.org/u/ukmoose)\
**Post date:** [27 August 2019 07:24 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/4 "2019-08-27T07:24:11Z")

</div>

Given you are using a commercial package based on Node-RED rather than Node-RED itself, can you explain a bit more about it?

Do you know what version of Node-RED it is based on?  
What version of nodejs does it use?  
Can you install nodes yourself?  
What version of the dashboard are you using?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [27 August 2019 07:34 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/5 "2019-08-27T07:34:22Z")

</div>

@ukmoose - it's an old one... :-)... the more relevant question is - do they have a support line you can ask ? 🙂

---

<div class="post-metadata">

**Author:** ![lineal](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@lineal](https://discourse.nodered.org/u/lineal)\
**Post date:** [27 August 2019 07:46 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/6 "2019-08-27T07:46:58Z")

</div>

Thanks for the link, I'll have a look. 🙂

---

<div class="post-metadata">

**Author:** ![lineal](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@lineal](https://discourse.nodered.org/u/lineal)\
**Post date:** [27 August 2019 07:55 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/8 "2019-08-27T07:55:18Z")

</div>

I'm not actually too sure. I'll should've tried to find out more about it before posting.

The version of node-red I'm using is 1.3.1. Dashboard version is 2.8.0... I might be able to install a newer versions, so I'll try that as well.  
There is an option to install nodes myself.

---

<div class="post-metadata">

**Author:** ![lineal](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@lineal](https://discourse.nodered.org/u/lineal)\
**Post date:** [27 August 2019 07:58 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/9 "2019-08-27T07:58:30Z")

</div>

I may have found a way to do it for now, although it's a bit unpredictable. I changed something on the PLC where my data is coming from, not in the software directly.

---

<div class="post-metadata">

**Author:** ![ukmoose](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ukmoose/32/13_2.png) [@ukmoose](https://discourse.nodered.org/u/ukmoose)\
**Post date:** [27 August 2019 08:01 UTC](https://discourse.nodered.org/t/sorting-the-bars-of-a-bar-chart/14809/10 "2019-08-27T08:01:22Z")

</div>

unfortunately that’s not the version number of Node-RED but the commercial package you are using.

Node-RED is currently on version 0.20.7  
with a beta of Node-RED v1.0

I wouldn’t suggest installing any nodes until you know the version of nodejs and the version of Node-RED it is based on.