# Creating bar chart from variables

**URL:** <https://discourse.nodered.org/t/creating-bar-chart-from-variables/91297>\
**Category:** General\
**Created:** [27 September 2024 08:04 UTC](https://discourse.nodered.org/t/creating-bar-chart-from-variables/91297 "2024-09-27T08:04:58Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sirhc](https://avatars.discourse-cdn.com/v4/letter/s/b77776/32.png) [@Sirhc](https://discourse.nodered.org/u/Sirhc)\
**Post date:** [27 September 2024 08:04 UTC](https://discourse.nodered.org/t/creating-bar-chart-from-variables/91297/1 "2024-09-27T08:04:58Z")

</div>

Hello

I am trying to create a bar chart in nodered. I have a function which every 60 seconds, adds to an existing variable. At midnight every night, the variable is reset to 0.

For example,  
at 0:00 - value = 0  
at 0:01 - value = 5  
at 0:02 - value = 8  
... eventually resetting back to 0 at 0:00.

The process then repeats itself.

I need to plot a bar for each 24 hour period, updated every 60 seconds with the revised value. Then after midnight, a new bar is created and the old bar is left where it is.

I can handle the timers, variable increasing etc. I'm just not sure how to get this data into the chart dynamically.

I have read that the bar chart accepts a payload as follows:

```auto
[{
    "series": ["X"],
    "data": [[5,6,9] ],
    "labels": ["Mon", "Tue", "Wed"]
}]

```

In my case, a new data number and label would need to be created every 24 hours. If this were an array I would be able to do it, but I don't think it is? What is the least painful way to update the payload to the chart dynamically as described above?

---

<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:** [27 September 2024 10:08 UTC](https://discourse.nodered.org/t/creating-bar-chart-from-variables/91297/2 "2024-09-27T10:08:11Z")

</div>

If your existing variable was an object

```auto
let myobject = {"Mon": 0, "Tue": 8, "Wed": 55, "Thu": 0, "Fri": 11, "Sat": 9, "Sun": 3}

```

Note myobject begins with "Mon", that's what will appear first on the chart.

Then you could pass it to your chart like this

```auto
msg.payload = 
[{
    "series": ["X"],
    "data": [Object.values(myobject)],
    "labels": Object.keys(myobject)
}]

```

And to update today's value

```auto
const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]  
const today = days[new Date().getDay()] // getDay() returns 0 to 6, 0 is Sun

myobject[today] = 99

```

> [@Sirhc](#):
>
> At midnight every night, the variable is reset to 0.

That's not going to work, your bar chart will show 0 for every day but today.  
You will need a strategy for clearing down the values, perhaps after 7 days.

But that's all for Dashboard 1. Do you have plans to migrate to the new dashboard?

---

<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:** [26 December 2024 10:08 UTC](https://discourse.nodered.org/t/creating-bar-chart-from-variables/91297/3 "2024-12-26T10:08:46Z")

</div>

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