Highcharts official support forum

Hello,
I make visualizations with the GANTT class.
When I want to show many lines in the y-axis, I create a scrollbar: {enabled: true,},
I always want to show the same number of lines, e.g. 30 lines and therefore I set the maximum: 30. But if there is only data to fill in fewer lines, a number appears in the field - see attachment.
Simple question - how do I remove that number so the field becomes empty?
Regards,
Soren

Hi Soren,

Thanks for contacting us with your question!

When you set yAxis max to 30, by default it will display values up to 30, regardless if your data matches this max - hence the numbers appear.
You can use yAxis label formatter function to conditionally render the yAxis labels based on the length of your data set: Please let me know if I can be of any further assistance.

Best regards,

Hi,
Thanks for helping me.
It's working but when I combine it with functionality to make plotbands it not working...

Can you help me again - thanks.

Regards,
Søren
//plotBands////////////////////////////////////////////
load: function() {
const chart = this;
const yAxis = chart.yAxis[0];
const plotBands = [];
for (let i = 0; i < yAxis.max; i += 2) {
plotBands.push({
color: '#eee',
from: -0.5 + i,
to: 0.5 + i
});
}
/////
yAxis.update({
plotBands
});
/////
},
//remove numbers////////////////////////////////////////////
labels: {
style: {
fontWeight: 'bold',
fontSize: '10px' // Set the font size for y-axis labels (Employee-names)
},
formatter: function() {
const totalDataPoints = this.axis.series[0].data.length
return parseInt(this.value) >= totalDataPoints ? "" : this.value
},
},

Hi,

Can you reproduce your issue in an online editor I could work with?
I've made a simplified demo with plotBand defined with basic API, and it work properly: https://jsfiddle.net/BlackLabel/abs5t893/

Best,

Thanks andrzej.b

Your jsfiddle was working for me.

What I want is that the odd lines in the chart should have a gray background so it's nicer to look at, no matter how many lines there are, and that's why I have to make a loop of some kind. I found the code I use for that online.

Maybe it's not necessary to use plotBands - maybe I can do it in HTML?

Regards,
Søren
////////////////////////
load: function() {
const chart = this;
const yAxis = chart.yAxis[0];

const plotBands = [];
for (let i = 0; i < yAxis.max; i += 2) {
plotBands.push({
color: '#eee',
from: -0.5 + i,
to: 0.5 + i
});
}
/////
yAxis.update({
plotBands
});
/////
},

Hi,

You can also iterate over plotBands: https://jsfiddle.net/BlackLabel/nvfodp7x/

Best,

Hi andrzej.b

It worked exactly as I wanted.

Thank you very much for the help - I appreciate it.

Regards,
Søren