在d3错误中画一条线

Question

我的d3（第4版）代码中似乎存在一个错误，而且我不太清楚为什么我的线条无法绘制。我的轴在那里，但我的直线路径无法计算。我以为这是我的数据类型的问题（现在它们都是数字），但是我一定缺少一些东西。你能帮我找到它吗？

Here is the codepen

以下是一些关键部分：

var line = d3.line()
.x(function(d) { return x(d.date); })
.y(function(d) { return y(d.ratio); });

g.append("path")
.datum(data)
.attr("fill", "none")
.attr("stroke", "steelblue")
.attr("stroke-width", 1.5)
.attr("d", line);

构建数据：

var baseValue = +data[0].avg_water_temp;

data.forEach(function(d) {
  d.date = d.date;
  d.ratio = +(d.avg_water_temp /baseValue);
});

仅此而已，y轴实际上是距基准值的距离，而不是距0的距离。因此，我的比率（y值）将是百分比。 Like This（不带对数刻度）

谢谢！！让我知道是否有什么可以澄清的。