blacklabel / grouped_categories

Grouped categories plugin for Highcharts by Black Label
http://blacklabel.github.io/grouped_categories/
Other
92 stars 74 forks source link

Overlapping labels if x-axis is narrow #179

Open DK-Unit4 opened 3 years ago

DK-Unit4 commented 3 years ago

Actual behaviour: Labels are overlapped when space is narrow (actual problem the tspan box of category labels is larger than category item area - otherwise I would truncate it myself with css) image

image

Expected behaviour: tspan width is same large as the category area

Example: https://jsfiddle.net/Kumlander/y1vLojwx/2/

KacperMadej commented 3 years ago

Hi @DK-Unit4

Thank you for reporting the problem. Looks like a duplicate of https://github.com/blacklabel/grouped_categories/issues/111

DK-Unit4 commented 3 years ago

Comment: I have removed the optional request to make it clearer.

For me it doesn't look to be quite the same - the problem here that label is located in the tspan that is wider that the category group area. If it would be as wide as it should then we would not have the problem or would be available to solve by workarounds. Unfortunately we (outside) cannot control the tspan size when we define thatx-axis labels should be 100% wide y the following setting: groupedOptions: [ { style: { width: '100%' }, }, ] }

PS: it works ok if a chart is much wider, but when it become smaller the tspan starts to be wider than the category area