ChartJs 条形图未在 y 轴上显示正确的值

Question

我有一个使用图表js和asp.net core动态加载的条形图。我正在尝试从 json 对象填充 yaxis 值，但它总是给我值 1。

以下是我的要求和代码

我想在 x 轴上绘制“Day”，在 y 轴上绘制“TotalActual”，请在下面找到我的代码

var WeeklyData = @Html.Raw(System.Text.Json.JsonSerializer.Serialize(Model.UDTSLDDailyPVA.ToList()))
        console.log(WeeklyData);

        let weeklylabels = [...new Set(WeeklyData.map((x) => x.Day))];
        console.log(weeklylabels);
        
        var weeklydatasets = WeeklyData.map(y => y.TotalActual);

        
       
        var barChartDataWeekly = {
            labels: weeklylabels,
            datasets: [{
                data:weeklydatasets,
                backgroundColor: [
                    'rgba(0, 154, 221, 1)'                    
                ]
            }],
        };

        window.onload = function () {
            var ctxUPHHistory = document.getElementById('barChartUPHHistory').getContext("2d");
            window.myBar = new Chart(ctxUPHHistory, {
                type: 'bar',
                data: barChartDataWeekly,
                options: {
                    responsive: true,
                    maintainAspectRatio: false,
                    scales: {
                        y: {
                            ticks: {
                                beginAtZero: true,
                                stepSize:50
                                //// Include a dollar sign in the ticks
                                //callback: function (value, index, ticks) {
                                //    return value + '%';
                                //}
                            }
                        }
                    },
                    plugins: {
                        legend: {
                            display: false
                        }
                    }
                }
            });
        };

但 y 轴值始终显示为 1，感谢对此的任何帮助。

Answer 1

可以使用解析属性，如：

options: {
  ...
  parsing : {
    xAxisKey : 'Day',
    yAxisKey : 'TotalActual
  },
}

这是一个例子