I would like to add a y counter label to my chart.js line v4.4.0 graph so that I don't have to hover over to view the count. The below code is currently what I have:

    <canvas class="canvas" id="status-canvas" style="width: 100%; height: 40vh;"></canvas>
    <script>
    var ctx = document.getElementById('status-canvas').getContext('2d');
    var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: @Html.Raw(Json.Serialize(Model.Report.Days.Select(x => x.Description))),
            datasets: [{
                label: 'Trends',
                data: @Html.Raw(Json.Serialize(Model.Report.Days.Select(x => x.Count))),
                fill: false,
                borderColor: 'rgb(75, 192, 192)',
                tension: 0.1
            }]
        },
        options: {
            interaction: {
                mode: 'nearest',
                axis: 'x',
                intersect: false
            },
            scales: {
                y: {

                    beginAtZero: true
                }
            }
        }
    });
    </script>

I've tried to reuse the following links: codepen datalabels I was expecting the below but with one line graph dataset as per my code above: sample

0

There are 0 best solutions below