# How to create a stacked bar graph

**URL:** <https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470>\
**Category:** FAQs\
**Created:** [10 February 2020 00:11 UTC](https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470 "2020-02-10T00:11:46Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![xraken](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/xraken/32/16962_2.png) [@xraken](https://discourse.nodered.org/u/xraken)\
**Post date:** [10 February 2020 00:11 UTC](https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470/1 "2020-02-10T00:11:46Z")

</div>

Hi, I need to create a staked bar graph. Is this possible with the node-red dashboard?  
example:  
 ![](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/1/a1b347a995eed559b9b53679bb8cbaa0efee40e2.jpeg)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [10 February 2020 20:33 UTC](https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470/2 "2020-02-10T20:33:34Z")

</div>

Based on data format example here: [https://github.com/node-red/node-red-dashboard/blob/master/Charts.md#bar-and-pie-charts](https://github.com/node-red/node-red-dashboard/blob/master/Charts.md#bar-and-pie-charts)  
And chartjs documentation here: [https://www.chartjs.org/docs/latest/charts/bar.html#stacked-bar-chart](https://www.chartjs.org/docs/latest/charts/bar.html#stacked-bar-chart)  
You will need to change **options** for chart to make bars stacked.  
Use `msg.ui_control` property to send options.

```auto
msg.payload = [{
    "series": ["X", "Y", "Z"],
    "data": [[5,6,9], [3,8,5], [6,7,2] ],
    "labels": ["Jan", "Feb", "Mar"]
}]
msg.ui_control = {
     options: {
        scales: {
            xAxes: [{
                stacked: true
            }],
            yAxes: [{
                stacked: true
            }]
        }
    }
}

return msg;

```

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [10 February 2020 22:02 UTC](https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470/3 "2020-02-10T22:02:38Z")

</div>

Nice example!

---

<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:** [24 February 2020 22:02 UTC](https://discourse.nodered.org/t/how-to-create-a-stacked-bar-graph/21470/4 "2020-02-24T22:02:41Z")

</div>

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