d3 xScale正在为折线图中的值写出NaN

Question

在尝试将缩放应用于简单折线图时，我有一个基本的d3问题。我看了类似的问题，但找不到任何匹配。

注释掉硬编码的x

//.x(function(d) { return d.game})

并切换到

缩放

.x(function(d) { return xScale(d.game);})

，我得到＆＃34;错误：属性d =＆＃34; MNaN，126.82926829268293LNaN，121.95121951219512 ...＆＃34;阅读控制台，似乎我的xScale获得了NaN。

奇怪的部分是yScale工作正常。我附加了包含我使用的数据集数组的JSFiddle，因此您可以看到结构和我的xScale变量。

JS Fiddle在这里：http://jsfiddle.net/mliew21396/98r4gjpz/

有谁知道我的xScale出了什么问题？

Answer 1

您从[]数组中遗漏了括号range。使用：

var xScale = d3.scale.linear()
                .domain([
                  0,
                  30
                ])
                .range([0,w]);

更好的是，使其可扩展和可维护并使用：

var xScale = d3.scale.linear()
                .domain([
                  d3.min(ds, function(d) {return d.game;}),
                  d3.max(ds, function(d) {return d.game;})
                ])
                .range([0,w]);