由于周末，Chart.js 时间序列 x 刻度重叠

Question

I use Chart.js to plot a line chart. My x axis is a timeseries . However, I have ticks overlapping due to weekend data.

Is there any way to avoid overlapping ticks? I used "autoskip: true" but it doesn't seem to work.

Here's how my configs look like:

           x: {
              parsing: false,
              type: "timeseries",
              time: {
                displayFormats: {
                  second: "HH:mm",
                  minute: "HH:mm",
                  hour: "HH:mm",
                  day: "MMM d",
                },
                tooltipFormat: "d MMM HH:mm",
              },
              grid: {
                display: false,
              },
              ticks: {
                autoskip: true,
              },
            },

And this is how the overlapping looks like:

Answer 1

You can achieve what you're looking for by writing a callback function that checks if the value is a weekend day

new Date(Date.parse(value)).getDay() == 1 || new Date(Date.parse(value)).getDay() == 2

If it is we just don't return it. Otherwise we return the value without changes.
This is how your config should look like:

x:{
   type: 'timeseries'
   time:{
         unit:'day',
   },
   ticks:{
        callback: function(value){
            //if weekend dont return the tick label
            if(new Date(Date.parse(value)).getDay() == 1 || new Date(Date.parse(value)).getDay() == 2 )
                return
            return value
        }
   }
}