Chartjs-How to change NaN values to 0 in Chart.js?

by

4👍

✅

Chart.js provides hooks for you to customize the content in the tooltips. They provide an example in their documentation for rounding, but you can quickly modify it to show a 0 instead of NaN. It should roughly look like this:

$scope.Chart = {
    ...
    options: {
        tooltips: {
            callbacks: {
                label: function(tooltipItem, data) {
                    var label = data.datasets[tooltipItem.datasetIndex].label || '';

                    if (label) {
                        label += ': ';
                    }
                    label += isNaN(tooltipItem.yLabel) ? '0' : tooltipItem.yLabel;
                    return label;
                }
            }
        }
    }
});

0👍

Hey, I had the same error as you and I tried to put many conditions in
my code but I failed then after I got my final result. And I got
succeed.

My code like this

  helper[key].NoOfReels += isNaN((parseFloat(o.NoOfReels)) == "" || parseFloat(o.NoOfReels));

or

isNaN(parseFloat(data[i].NoOfReels)) ? '0' : parseFloat(data[i].NoOfReels);

Leave a comment