[Charts] Can't Middle Align Tooltip Text

I've made a Line Chart but I can't seem to center the text within the tooltip. I can seem to get the text middle aligned but then it is spilling off the end of the tooltip. (Please see https://github.com/chartjs/Chart.js/issues/1977 for references to people with the same issue as me. The image I have attached is from this.)

Is this a bug or does something need to be changed in my options? Below are the options from my TS file.

public chartOptionsLine: any = {
    responsive: true,

    legend: {
        position: 'top',
        alignment: 'left',
        labels: {
            usePointStyle: true,
        }
    },

    tooltips: {
        mode: 'nearest',
        intersect: false,
        position: 'nearest',
        caretSize: 8,
        borderStyle: 'solid',
        displayColors: false,

        yAlign: 'bottom',
        xAlign: 'center',
        xPadding: 25,
        yPadding: 15,
        _bodyAlign: 'center',
        _footerAlign: 'center',
        bodyAlign: 'center',
        titleAlign: 'center',
    },
};