StevenAtHL
Posts: 6
Joined: Mon Sep 20, 2021 11:10 pm

On stacked column charts can I move data labels outside of the columns

I would like the data labels on a stacked column chart to appear next to the columns with a line connecting them, similar to how data labels with connectors appear on pie charts. Here is an example on a pie chart: https://jsfiddle.net/gh/get/library/pur ... onnectors/
Is this possible to do on stacked column charts?
mateusz.b
Posts: 2006
Joined: Tue Jul 13, 2021 11:34 am

Re: On stacked column charts can I move data labels outside of the columns

Hello StevenAtHL,

Welcome to our forum and thanks for contacting us with your question!

Could you explain in details where would you like the labels to be located? In case of column chart, by default they are placed inside columns, or alternatively when dataLabels.inside: false, they are placed relatively to the top of the column. You can adjust data labels position by setting their x and y offset (https://api.highcharts.com/highcharts/s ... taLabels.x), but it might be hard to keep the responsiveness, because these values allow you to set fixed data label offset.

When it comes to data labels connector, this options is not available purely from API for column series type. You could try to use SVG renderer and draw connector for each label.
API reference: https://api.highcharts.com/class-refere ... VGRenderer

Best regards!
Mateusz Bernacik
Highcharts Developer
StevenAtHL
Posts: 6
Joined: Mon Sep 20, 2021 11:10 pm

Re: On stacked column charts can I move data labels outside of the columns

Hi Mateusz,

Sorry for the slow reply, we found a workaround for the time just having the labels display outside of the bar. The svg renderer seems to be a good way to create connector though
mateusz.b
Posts: 2006
Joined: Tue Jul 13, 2021 11:34 am

Re: On stacked column charts can I move data labels outside of the columns

Hi StevenAtHL,

Glad to hear you fond the workaround. In case of any further questions feel free to contact us again.

Regards!
Mateusz Bernacik
Highcharts Developer

Return to “Highcharts Usage”