d3.js - d3.时间刻度返回 NaN

Question

我有以下示例

http://jsfiddle.net/BSB42/

我似乎无法弄清楚为什么 x 比例对我不起作用(我的 cx 值得到 NaN)。这是我的代码的摘录:

var parse = d3.time.format("%Y").parse;

var data = [
    { year: "2008", number : 3},
    { year: "2009", number : 10},
    { year: "2010", number : 17},
    { year: "2011", number : 23},
    { year: "2012", number : 34},
    { year: "2013", number : 50}
];



for (var i = 0; i < data.length; i++) {
    var d = data[i];
    d.year = parse(d.year);
};


var yearScale = d3.time.scale()
    .domain(d3.extent(data, function (d) { return d.year;}))
    .range(50, window.innerWidth - 50);

var numberScale = d3.scale.linear()
    .domain([0, d3.max(data, function (d) { return d.number;})])
    .range([50, window.innerHeight - 50]);


svg.selectAll("circle")
    .data(data)
    .enter()
    .append("circle")
    .attr({
        cx: function (d) { return yearScale(d.year); },
        cy: function (d) { return window.innerHeight - numberScale(d.number)},
        r: 4,
        fill: "#fff",
        stroke: "#78B446",
        "stroke-width": 4
    })  

Answer 1

.range() 需要一个数组，因此请在 yearScale 中更改为 .range([50, window.innerWidth - 50]); >。您已经正确地对 numberScale 进行了操作。

已更新jsFiddle