Add custom string label to specific columns of a chart

Hi, I have a column chart and I would like to add a string label to specific columns of a column chart. Using the Edit Chart Config, I found a way of showing the numeric value as label of those columns, but I can't find a way of customizing the label and use a string instead of the numeric value. Do you know how can I do this? Thanks!

0 1 113
1 REPLY 1

I fed your prompt to the HighCharts GPT helper and it gave me this code:

You can customize the labels of specific columns in a Highcharts column chart by using the `dataLabels` option and providing a custom formatter function. This allows you to return a string label instead of the default numeric value. Here's an example of how to do this:

```javascript
Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Custom Column Labels Example'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'John',
data: [5, 3, 4],
dataLabels: {
enabled: true,
formatter: function() {
// Customize the label based on the column index
const labels = ['Five', 'Three', 'Four'];
return labels[this.point.index]; // Return the corresponding string label
}
}
}]
});
```

In this example, the `formatter` function is used to return a string label based on the index of the column. You can customize the `labels` array to include any string you want for each column.

Screenshot 2025-02-28 at 11.46.56 AM.png

Top Labels in this Space
Top Solution Authors