graph - D3 线图 - 单线似乎被分割成几个

Question

我正在为区间数据进行相对简单的可视化。数据点将在一天中每 15 分钟报告一次，我正在尝试将其绘制成一整天的图表。如果我将它限制在很少的点上，一切都很好，但是当我尝试使用一整天的数据时，由于某种原因，这条线似乎分成几行。

我检查了 SVG 元素，只有一个路径元素，所以我不确定发生了什么。我已将所有相关代码（实际上非​​常简单，没有太多混乱的空间）放入小提琴以供参考：http: //jsfiddle.net/TUjhB/。任何提示表示赞赏。

var data = d3.csv.parse(csvData);

var line = d3.svg.line()
  .x(function (d) { return x(d.Timestamp); })
  .y(function (d) { return y(d.num); });

svg.append("path")
  .datum(data)
  .attr("class", "line")
  .attr("d", line);

Answer 1

如果您对数据进行排序（在您的输入中未排序），它工作正常 -

data.sort(function(a,b) { return a.Timestamp - b.Timestamp; });

在这里完成 jsfiddle 。