'chart.js with null data point in dataset

Is there a way to have chart.js display the datapoint as 0 if a data point is missing from a date-based dataset? For example, if I have a dataset with a null data value for a month, chart.js won't display a data point. Google charts seems to do this, but I would really prefer to stick with Chart.js if this functionality is there.

Thanks in advance.



Solution 1:[1]

No, there is no such function. chart.js only handles the input data. So it does not know what is the meaning behind the data. That is not possible. It takes it as it is - and that is good.

You have to write a function which checks if all data points you want to have are in your array and if not create them and initalize them with 0. Than handle the array over to chart.js.

I think you need something like this:

let needed_days_in_data = (end_time.getTime() - start_time.getTime()) / (1000 * 3600 * 24);
for (let i = 0; i < needed_days_in_data; i++) {
    let date_check = new Date(start_time.getTime());
    date_check.setDate(start_time.getDate() + i);

    //HERE CHECK IF DATE IS ALREADY IN ARRAY
    //IF DATE IS NOT IN ARRAY PUSH IT TO ARRAY WITH VALUE 0
}

Solution 2:[2]

yes in chart.js you can have values as zero like this

'''

  var myChart = new Chart (ctx,{
            type: 'bar', 
data: {
        labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
        datasets: [{
            data: [20, 0, 0, 0, 3, 9]
        }]
    }
});

'''

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 IMAD HAMMANI