[Chartjs]-Chart.js hide gridline inside chartarea but keep y-axis border

1👍

Set scales.yAxes[0].gridLines.drawTicks to false and and some padding in gridLines.ticks.padding:

{
    type: 'horizontalBar',
    data: {
        labels: [4, 3, 2, 1],
        datasets: [{
            data: [50, 60, 70, 180]
        }]
    },
    options: {
        legend: {
            display: false
        },
        scales: {
            yAxes: [{
                gridLines: {
                    drawOnChartArea: false,
                    drawTicks: false,
                },
                ticks: {
                    padding: 10
                }
            }],
            xAxes: [{
                gridLines: {
                    drawBorder: true,
                    display: false,

                },
                ticks: {
                    display: false,
                    min: 20,
                    max: 70
                }
            }]
        }
    }
}

hidden ticks with y axis border

Leave a comment