Chart.js仅在页面上的最后一个图表上显示X轴标签

Question

我有6个Chart.js图形显示在一页上。现在，每个图形都以相同的方式设置。我无法弄清的问题是，X轴标签仅出现在最后一张图上。如果要删除最后一张图的JavaScript，则X轴标签将出现在倒数第二张图上，依此类推。如果以这种方式在页面上显示多个图形，为什么有人会为什么X轴标签仅按顺序显示在最后一个图形上？

示例代码，所有6个图形都使用相同的代码结构：

// Weekly New Tickets
$(document).ready(function () {
    showGraph_weekly_new_tickets();  // Change this for new graph
});

function showGraph_weekly_new_tickets()  // Change this for new graph
{
    {
        $.post("data_weekly_new_tickets.php",  // Change this for new graph
        function (data)
        {
            console.log(data);
            var name = [];
            var marks = [];

            for (var i in data) {
                name.push(data[i].week_of);  // Change this for new graph
                marks.push(data[i].Weekly_Ticket_Count);  // Change this for new graph
            }

            var chartdata = {
                labels: name,
                datasets: [
                    {
                        label: 'Weekly New Tickets',  // Change this for new graph
                        backgroundColor: '#0000FF',
                        borderColor: '#46d5f1',
                        hoverBackgroundColor: '#CCCCCC',
                        hoverBorderColor: '#666666',
                        data: marks
                    }
                ]
            };

            //will set background color as white instead of transparent
            var backgroundColor = 'white';
            Chart.plugins.register({
                beforeDraw: function(c) {
                    var ctx = c.chart.ctx;
                    ctx.fillStyle = backgroundColor;
                    ctx.fillRect(0, 0, c.chart.width, c.chart.height);
                }
            });               

            var graphTarget = $("#weekly_new_tickets");  // Change this for new graph

            var barGraph = new Chart(graphTarget, {
                type: 'bar',
                data: chartdata,
                options: {
                    title: {
                        display: true,
                        text: ['Weekly New Tickets']  // Change this for new graph
                    }, 
                    animation: {
                        duration: 0, // general animation time
                    },                                     
                    legend: {
                        display: false
                    },
                    tooltips: {
                        enabled: true
                    },

                    scales: {
                        xAxes: [{
                            ticks: {
                                fontSize: 12,
                                autoSkip: false,
                                maxRotation: 45,
                                minRotation: 45,                                              
                            }
                        }]
                    },


                }                                
            });
        });
    }
}
</script>