[Chartjs]-ChartJs: is it possible to show lesser or a certain data point on line?

by

1👍

✅

You can use a scriptable function for this:

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3],
            pointRadius: (context) => context.dataIndex == (context.chart.data.datasets[context.datasetIndex].data.length - 1) ? 10 : 0 // Default is 3, used 1- for more clarity
        }]
    },
    options: {
    }
});
<script src="https://npmcdn.com/chart.js@4.2.0/dist/chart.umd.js"></script>
<div class="myChartDiv">
  <canvas id="myChart" width="600" height="400"></canvas>
</div>

Leave a comment