Question

Views

Simple question, but can't seem to find the answer.

How can we remove a specific label on x-axis in chart.js?

This is the curve I currently have:

Is there a way to simply hide the 9am while keep showing other label (10am.....)?

Things I tried:

ticks: {
                   
         callback: function(value, index, values) {
               return '';
            }
         }

But this will remove all the label on x-axis.

Any helps will be appreicated

Note: this is not a duplicate of Remove x-axis label/text in chart.js since I want to remove a specific x-label only.

about 4 years ago · Juan Pablo Isaza

Answer question

Accepted Answer · 2022-06-29T02:53:16.975Z

You always need to return something. So you can first check if the current label is 9am if so return an empty string otherwise return the label:

ticks: {
  callback: function(value, index, values) {
    const label = this.getLabelForValue(value)
    return label === '9am' ? '' : label;
  }
}