我想在每个条形图的顶部显示数据标签，我已经用Chartdatalabels插件做到了这一点。但它不是显示值，而是显示如下所示的对象，我只需要显示第二个图形的数据标签（红色突出显示）

我使用的代码如下所示。我已经注册了datalabels插件。

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);
        
        let weeklydatasets = (WeeklyData.map((y) => y.TotalActual));
        console.log(weeklydatasets);
        
       
        var barChartDataWeekly = {
            labels: weeklylabels,
            datasets: [{                
                data: WeeklyData,
                backgroundColor: [
                    'rgba(0, 154, 221, 1)'                    
                ]
            }],
        };

        var YieldData = @Html.Raw(System.Text.Json.JsonSerializer.Serialize(Model.UDTSLDMonthlyYield.ToList()))
        var AnnotationValue = YieldData[0].YieldTarget;
        console.log(AnnotationValue);
        let yieldlabels = [...new Set(YieldData.map((x) => x.Day))];

        var yieldDataMonthly = {
            labels: yieldlabels,
            datasets: [{                
                data: YieldData,
                backgroundColor: [
                    'rgba(0, 154, 221, 1)'                    
                ]
            }],
        };

        Chart.register(ChartDataLabels);

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

            var ctxYieldHistory = document.getElementById('barChartYieldHistory').getContext("2d");
            window.myBar = new Chart(ctxYieldHistory, {
                type: 'bar',
                data: yieldDataMonthly,                
                options: {
                    responsive: true,
                    maintainAspectRatio: false,
                    parsing: {
                        xAxisKey: 'YM',
                        yAxisKey: 'YieldActual'
                    },
                    scales: {
                        y: {
                            ticks: {
                                beginAtZero: false,
                                stepSize: 20,
                                // Include a dollar sign in the ticks
                                callback: function (value, index, ticks) {
                                    return value + '%';
                                }
                            }
                        }
                    },
                    plugins: {
                        legend: {
                            display: false
                        },
                        datalabels: {
                            anchor: 'end',
                            align: 'end',
                            labels: {
                                value: {
                                    color: 'white'
                                }
                            },
                            formatter: (val) => {
                                return val + '%';
                            }
                        },
                        annotation: {
                            annotations: {
                                line: {
                                    type: 'line',
                                    yMin: AnnotationValue,
                                    yMax: AnnotationValue,
                                    borderWidth: 2,
                                    borderColor: 'white'
                                }
                            }
                        }
                    }
                }
            });
        };

字符串
感谢你的帮助。