Javascript 使用类似于d3.line.defined（）的东西绘制一个d3点图

我想画一个d3折线图，显示数据点的点，如中所示。但我想使用d3.line.defined（）这样的函数将某些数据值定义为不可写

---

很明显，这对折线图是有效的，但是对于将要为“点”绘制的圆，我该怎么做呢？也许这很简单，但我不太明白怎么做。也许这是一个过滤数据数组的问题。

我的直觉似乎起了作用。 因此，如果我的线图是

var line = d3.line()
    .defined(isdefined)  
    .x(function (d) {
        return x(d.xVal);
    })
    .y(function (d) {
        return y(d.yVal);
    })
   .curve(d3.curveMonotoneX);

var svg = d3.select("body")
   .append("svg")
   .attr("width", width)
   .attr("height", height)
   .append("g");
svg.append("path")
   .attr("d", line(data));

然后我可以在数据点上添加“点”（圆），使用相同的函数（isDefined）来确定有效数据

svgG.selectAll('circle')
    .data(data.filter(isdefined))
    .enter().append('circle')
    .attr('r', 5)
    .attr('cx', function(d) {
        return x(d.xVal);'
    })
    .attr('cy', function(d) {
        return y(d.yVal);'
    })

---

参见本代码页中的一个工作示例：

，您应该考虑在绘制数据源之前对其进行过滤。但也许你也应该在你的问题中发布一些代码。我可视化的部分目的是显示数据何时可用，何时不可用。