The stackLabels are misplaced when rotation is set.

[raf18seb]

Actual behaviour

The longer text, the bigger is misplace of stackLabels.

Live demo with steps to reproduce

https://jsfiddle.net/BlackLabel/tnv25pzq/

Product version

Highcharts 9.0.0

[PaulDalek]

It is a regression. The latest working version is 7.1.2.

Demo
https://jsfiddle.net/BlackLabel/mg3u54dv/

Bisected to commit ed7ea40.

[gustavoittner]

Meanwhile there is a workaround to this issue?

[PaulDalek]

Hi @gustavoittner

You could try to make stack labels as HTML elements and rotate them through inline CSS with transform: rotate.

Demo
https://jsfiddle.net/BlackLabel/ym9gLr2z/

[gustavoittner]

Even in the HighCharts version 7.1.2, the stackLabels that are too large to fit the chart are not adjusted to fit. Another issue is that the stackLabels can overlap the series dataLabels. Is there any way that I could handle the collision between the stackLabels and the dataLabels giving stackLabels priority over dataLabels?

Current:

Expected (collision and fit handled):

Is there any way that I can achieve this behavior?

[KacperMadej]

@gustavoittner
This looks like a different problem and should be reported in a different issue - this one is about the misplaced position after rotation. It looks like the priority is already in favor of stackLabels - maybe you could add a live demo?

[gustavoittner]

@KacperMadej

In the fiddle I'm using version 7.1.2 which is supposed to have the expected behavior, but it still has some problems.

https://jsfiddle.net/3r8bp9dq/

In version 7.1.2 the result is not like image bellow (the behavior of the image below is not present in any version of Highcharts):

Differently from the fiddle, in the image above:

1. The stackLabels are not over the column stacks, only when they are adjusted to fit into the chart
2. When stackLabels are adjusted to fit into the chart, the possible collisions with series.dataLabels are resolved, giving priority to the stackLabel over the conflicted dataLabel

In the fiddle, for some reason, the second column stack has lost the dataLabel, even thought there is no collision happening. I don't know if it's gonna happen in current Highcharts version after the regression:

[KacperMadej]

It's (hopefully) not going to happen because you have pointed this out, so thank you.
Demo of the second problem (wrong overlap detection): https://jsfiddle.net/BlackLabel/9nkbr7sf/

[isiemers]

The original issue (stack labels with set rotation being horizontally offset, proportionally to the length of the label) is still present in version 10.3.2

[pawellysy]

Thanks for your input @isiemers! We are in process of refactoring this module. Any updates will be posted in the thread, or linked PR's.