# Chart x axis label positions

**URL:** <https://discourse.nodered.org/t/chart-x-axis-label-positions/92763>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [29 October 2024 09:03 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763 "2024-10-29T09:03:30Z")\
**Posts on this page:** 5\
**Page:** 1

<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 October 2024 09:03 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763/1 "2024-10-29T09:03:30Z")

</div>

In this example of a chart, which bar does the x axis datum "20" apply to:  
The lilac one, vertically above the start of the label?  
The blue one, vertically above the end of the label?  
The orange one, which an inserted underline points to?

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/9/29a5987caa1101bf8da61ab3ce2bde101f622a1f.png)

Spoiler alert: it's the red one.

I feel that this inhibits understanding of the data displayed in the chart.

Is there a way to clearly connect the label to the bar it refers to?

---

<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:** [29 October 2024 09:59 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763/2 "2024-10-29T09:59:00Z")

</div>

> [@jbudd](#):
>
> Is there a way to clearly connect the label to the bar it refers to?

I think that it's not the chart to blame. All charting libraries are built in the way that if you do use them wisely, the outcome is pleasant. But if something doesn't look right it is mostly a case of misuse in one or more aspects.  
Data visualization is science. But not as hard as chemistry or rockets ..  
Many articles can be found about common mistakes and how to avoid them.

[https://www.google.com/search?q=Data+visualization+mistakes+examples&sca\_esv=853f175af13f0422&rlz=1C1GCEA\_enEE1074EE1075&biw=2048&bih=1026&sxsrf=ADLYWIIQ\_lYmEJKUKcf1mGFu\_pxOcp0xgQ%3A1730194615268&ei=t6wgZ6z9D96bwPAPspPniAQ&ved=0ahUKEwjstL2bpbOJAxXeDRAIHbLJGUEQ4dUDCA8&uact=5&oq=Data+visualization+mistakes+examples&gs\_lp=Egxnd3Mtd2l6LXNlcnAiJERhdGEgdmlzdWFsaXphdGlvbiBtaXN0YWtlcyBleGFtcGxlczIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYR0iYDlAAWABwAngAkAEAmAFCoAFCqgEBMbgBA8gBAJgCAqACC5gDAIgGAZAGCJIHATKgB5sG&sclient=gws-wiz-serp](https://www.google.com/search?q=Data+visualization+mistakes+examples&sca_esv=853f175af13f0422&rlz=1C1GCEA_enEE1074EE1075&biw=2048&bih=1026&sxsrf=ADLYWIIQ_lYmEJKUKcf1mGFu_pxOcp0xgQ%3A1730194615268&ei=t6wgZ6z9D96bwPAPspPniAQ&ved=0ahUKEwjstL2bpbOJAxXeDRAIHbLJGUEQ4dUDCA8&uact=5&oq=Data+visualization+mistakes+examples&gs_lp=Egxnd3Mtd2l6LXNlcnAiJERhdGEgdmlzdWFsaXphdGlvbiBtaXN0YWtlcyBleGFtcGxlczIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYRzIKEAAYsAMY1gQYR0iYDlAAWABwAngAkAEAmAFCoAFCqgEBMbgBA8gBAJgCAqACC5gDAIgGAZAGCJIHATKgB5sG&sclient=gws-wiz-serp)

---

<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 October 2024 11:05 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763/3 "2024-10-29T11:05:44Z")

</div>

For sure I may have used the wrong chart type or colours or y axis format.

However the picture shows what the chart widget/chartjs delivers, and it's ~~(expletive deleted)~~ sub-optimal.

---

<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:** [29 October 2024 12:13 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763/4 "2024-10-29T12:13:12Z")

</div>

I do have some experiences with widget creation which involves some kind of tick marks with labels. It is full of compromise decisions and close to zero options for creativity.

---

<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 November 2024 12:13 UTC](https://discourse.nodered.org/t/chart-x-axis-label-positions/92763/5 "2024-11-28T12:13:20Z")

</div>

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