# Help with a bar graph

**URL:** <https://discourse.nodered.org/t/help-with-a-bar-graph/57431>\
**Category:** General\
**Created:** [28 January 2022 22:39 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431 "2022-01-28T22:39:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![joe7](https://avatars.discourse-cdn.com/v4/letter/j/aca169/32.png) [@joe7](https://discourse.nodered.org/u/joe7)\
**Post date:** [28 January 2022 22:39 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431/1 "2022-01-28T22:39:54Z")

</div>

Is it possible to make a graph like this, if so, how. I've been looking for a week on how to do it.

 ![graph](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/a/1a173290b441b0f6e7a4be99d646a3b026462432.jpeg)

---

<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 January 2022 00:42 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431/2 "2022-01-29T00:42:58Z")

</div>

Can you share what you have managed to get so far?

---

<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:** [29 January 2022 11:34 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431/3 "2022-01-29T11:34:50Z")

</div>

Here is an example of how you can get that layout, you will need to apply styling to get exactly what you require.

```auto
[{"id":"7b41d47e.2cc8ac","type":"inject","z":"c791cbc0.84f648","name":"","props":[{"p":"payload"},{"p":"ui_control","v":"{\"options\":{\"scales\":{\"xAxes\":[{\"stacked\":true}],\"yAxes\":[{\"stacked\":true}]}}}","vt":"json"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"[{\"series\":[\"POSITIVE\",\"NEGATIVE\"],\"data\":[[15,0,4.92,0,23.16,0,21.84,0,19.4],[0,-2,0,-10,0,-8.34,0,-13.67,0]],\"labels\":[\"12h\",\"13h\",\"14h\",\"15h\",\"16h\",\"17h\",\"18h\",\"19h\",\"20h\",\"21h\",\"22h\",\"23h\",\"24h\"]}]","payloadType":"json","x":290,"y":1460,"wires":[["e5135343.b5eee8"]]},{"id":"e5135343.b5eee8","type":"ui_chart","z":"c791cbc0.84f648","name":"","group":"2d4fe667.28f8ba","order":3,"width":"12","height":"9","label":"Chart","chartType":"bar","legend":"true","xformat":"D/M","interpolate":"linear","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":1,"removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#5fad47","#d73920","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"className":"","x":420,"y":1460,"wires":[[]]},{"id":"2d4fe667.28f8ba","type":"ui_group","name":"demo","tab":"1caa8458.b17814","order":1,"disp":true,"width":"12","collapse":false},{"id":"1caa8458.b17814","type":"ui_tab","name":"Demo","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![joe7](https://avatars.discourse-cdn.com/v4/letter/j/aca169/32.png) [@joe7](https://discourse.nodered.org/u/joe7)\
**Post date:** [2 February 2022 17:42 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431/4 "2022-02-02T17:42:36Z")

</div>

that ok

thank you

---

<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:** [16 February 2022 17:43 UTC](https://discourse.nodered.org/t/help-with-a-bar-graph/57431/5 "2022-02-16T17:43:26Z")

</div>

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