用 d3 绘制非连续线答案

【问题标题】：Drawing non-continuous lines with d3用 d3 绘制非连续线
【发布时间】：2013-02-21 22:59:32
【问题描述】：

我正在使用 d3.js 制作一个简单的折线图。我想知道是否有办法在图表中创建“洞”，即在没有可用数据的情况下是否可以中断或切断线。

我正在考虑从域中删除我不需要的地方，或者在特定段中将线宽设置为 0，但我找不到执行这些操作的方法。

感谢您的帮助！

【问题讨论】：

【解决方案1】：

D3 line 生成器有一个内置函数可以做到这一点，line.defined。您可以使用此函数来控制定义行的位置和未定义行的位置（例如丢失数据的位置。）如果您想在点数组中的第二个值是 javascript NaN 值时使行未定义，您可以说：

line.defined(function(d) { return !isNaN(d[1]); });

Here 就是一个很好的例子。

【讨论】：

您的示例将不起作用（如预期），因为如果 d 是 null 该函数将永远不会被调用或无法确定未定义位置的位置（例如在 x 轴上）。在块代码中使用的代码是return d.y != null。
谢谢@Rouby。我已经用 API 文档中的当前示例更新了答案。
仅当数据具有未定义类型的值时才有效。如果键是离散的但每个键都有一个值怎么办？