Question

我有以下示例

我似乎无法弄清楚为什么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()需要一个数组，因此请更改为.range([50, window.innerWidth - 50]);中的yearScale。您已经为numberScale已正确执行了此操作。

更新jsFiddle

d3.time规模返回NaN

1 个答案: