Data tags in a bar chart impact the height of the bars

[lenormf]

Hi,

In a bar chart, bars that are narrower than the length of their data label will scale vertically, and the data label will word-wrap. For example:

I think a way to solve that, which would also make more sense for bars, is to display data labels next to the bar, instead of within it. Data for bars that are maxed would end up being displayed “outside” the graph, though.

HTH.

[acavalin]

Hi, i got the same problem with smaller values to be represented. I implemented two solutions:

1. text within the bar + clip content if too short

   table.charts-css.bar tbody span.data {
    white-space: nowrap;
    overflow: hidden;
   }

2. text in the middle of the bar's edge

   table.charts-css.bar tbody span.data {
    white-space: nowrap;
    position: relative;
    left: 1rem; /* increment this to move to the right */
   }

Hope this helps and/or be included in the sources 😃

[fang-wei-jie]

I was thinking if there is a way to pad some spaces so that the data can be shown on the end (either left or right, depending on the direction of the graph was set) of the data axes without overflowing to the outside of the div area.