Chart x axis label positions

[jbudd]

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?

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?

[hotNipi]

@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

[jbudd]

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.

[hotNipi]

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.