[Chartjs]-Chart.js: Force display of a certain label with autoSkip: true

by

1👍

I had the same issue. This feature was removed by this pull request, as you can see it is not possible to configure your chart to do the old behavior but you can write your own logic to render the ticks using the afterBuildTicks callback.

example:

xAxes: [{
    type: 'time',
    afterBuildTicks: function (axis, ticks) {

    // max possible ticks
    const totElements = 20;

    if (ticks.length <= totElements) {
        return ticks;
    }
                            
    // this number is used to display a tick every n ticks
    const density = Math.trunc(ticks.length / totElements);

    if(isNaN(density)){
        console.warn('Nan in ticks')
        return ticks;
    }

    return ticks.filter((t, index) => {
        // always show the first and the last tick
        if (index === 0 || index === ticks.length - 1) {
            return t;
        } else if (index % density === 0) {
            return t;
        }
    })
},...

Leave a comment