D3图形未显示

Question

在过去的几个小时中，我一直在研究这个问题，但似乎无法在下面的jfiddle中显示步骤图

http://jsfiddle.net/uk8t6mtg/1/

我怀疑这是因为我误解了如何在概念上使用x轴。

我正在尝试制作一个具有以下数据的图形：

data = {"step_plot_3": {"x_axis": ["4-Jun-07", "5-Jun-07", "6-Jun-07", "7-Jun-07", "8-Jun-07"], "y_axis": [0.32322222222152003, 9.7200555555434001, 0.8200000000001999, 0.27433333333332, 1.0541111111102599]}}

日期可能不连续，但间隔相等。 y值对应于小时，并由阶梯图表示。

该代码主要来自D3.js示例，并对我自己进行了其他修改。

例：

http://bl.ocks.org/mbostock/3883245

任何有关如何调试此问题的建议将不胜感激。

Answer 1

在您的JS控制台或DOM中，您将看到路径的d值为无效值“ MNaN，447.6 .....”。 xAxis缩放函数输入了错误的值。 如果将小提琴的第48行更改为： return parseDate(d); 您会看到一个有效的路径。

Answer 2

另外，您还需要设置路径样式以删除填充并添加笔触颜色。 就像是：

.line {
    fill:none;
    stroke: red;
}