javascript - 没有数据时 SVG 路径中有间隙

Question

我正在尝试在 D3 中创建实时折线图。我的数据格式为 [[Date, value], [Date, value]。当我没有收到任何数据时，该值将为 0。我希望为这些值换行，以便不绘制它们。然后，我会在我缺少数据的地方出现缺口。

有人知道我该怎么做吗？

Answer 1

试试这个。变量 my_dataset 是具有属性 {x,y} 的对象数组。 "NaN:因为在可视化中跳过了 y 值。

var line = d3.svg.line()
  .x( function( d, i) { return x( d.x); })
  .y( function( d) { return y( d.y); })
  .defined( function( d) { return !isNaN( d.y); })
  ;

my_visualization.append( "svg:path")
    .data( [ my_dataset])
    .attr( "d", line)