2.0.0 null data points not rendering correctly

[orefors]

I have a a dataset for a line chart that contains some null values. The issue is that the null values cause the rendering of the line to skip points between the first and the last null value (see below). The points themselves are however correctly rendered. Also, if null values are expressed as "null" in the dataset, it throws an error, whereas if expressed as empty points the above happens.
The chart looks like this:

The code is as follows:

[etimberg]

@orefors these are the options you want to play with. Both are booleans. You can define them per dataset or change them in the config to affect all lines.

options: {
    elements: {
        line: {
            skipNull: true,
            drawNull: false,
        }
    }
}

[orefors]

Thanks @etimberg, I had missed those options

[etimberg]

@orefors did they help at all? I was thinking about this more ... you may need to put in null rather than simply leaving the value as undefined

[orefors]

@etimberg, changing the value of skipNull or drawNull makes no difference. If I use null rather than just ",," I get an error at line 3883 in Chart.js.(rawValue is null). If I use ",," there is no error but still the same rendering issue mentioned above.

[etimberg]

@orefors can you drop your code into a JSFiddle? I'll try and do some debugging on it and see.

[orefors]

@etimberg , this is the code I am up to. It now renders all points, event the null points, regardless of the values set in the options above.

        var config = {
            type: 'line',
            data: {
                labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15'],
                datasets: [{
                    label: "Values",
                    data: [20, 32, null, 33, 18, 39, null, null, 54, null, 29, 17, 38, 44, 35],
                    yAxisID: "y-axis-1",

                }]
            },
            options: {
                elements: {
                    line: {
                        skipNull: false,
                        drawNull: true,
                    }
                },
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    xAxes: [{
                        display: true,
                        type: 'category',
                        yAxisID: "x-axis-1",
                        labels: {
                            userCallback: function (labelString, index) {
                                return (index % 2 === 0) ? labelString : '';
                            }
                        }
                    }],
                    yAxes: [{
                        display: true,
                        position: "right",
                        id: "y-axis-1",
                        override: {
                            start: -10,
                            stepWidth: 10,
                            steps: 7
                        },
                    }]
                }
            }
        };

        window.onload = function () {
            var ctx = document.getElementById("canvas").getContext("2d");
            myLine = new Chart(ctx, config);
        };

[matt-h]

I'm also having this same issue, here is a simplified jsfiddle that has the issue.
http://jsfiddle.net/qjzv8hsw/1/

[etimberg]

@matt-h I updated your JSFiddle with the latest build from the v2.x branch. The skipnull and drawnull options were working as expected. Can you confirm?

[matt-h]

@etimberg I can confirm that the latest build works as expected. Here is the updated jsfiddle for reference: https://jsfiddle.net/qjzv8hsw/2/

[etimberg]

Great to hear @matt-h

[emcniece]

@etimberg Has this changed for v2.1.3? I can't find these properties anywhere in Chart.js...

Ref: #1566