Add Space/gap In A Line In D3

I have a multiline chart similar to this, where each line represent a particular year and the x-axis represents days(e.g. Jan 1, Jan 2, ... Dec 31) in that particular year. some li

Solution 1:

You can use line.defined: https://github.com/d3/d3/wiki/SVG-Shapes#line_defined

According to the API:

The defined accessor can be used to define where the line is defined and undefined, which is typically useful in conjunction with missing data.

If your line should be undefined where the value is null or NaN, do this:

line.defined(function(d) { return !isNaN(d.x); });