Chart.js xAxis bottom label alignment

Question

My chart.js bottom label looses it center alignment when I line break it into two lines and when my labels are rotated to 90 degrees

MY Xaxis code

        xAxes: [{
            display: true,
            afterFit: function (scale) { scale.height = 170; },
        

            stacked: true,
            gridLines: {
                display: false,
                borderDash: [2, 6],
                color: "black",
            },
            ticks: {
                fontColor: "#4A4A4A",
                fontFamily: "Montserrat",
                fontSize: 14,
                fontStyle: 600,
                maxRotation:90,
                minRotation:90,
            }
        }],