Question

我在d3散点图中的r值上出现NaN错误。

控制台错误：错误：属性r的值无效=“NaN”

从代码的这一部分开始：

g.selectAll(".response") .attr("r", function(d){ return responseScale(d.responses); }) .attr("cx", function(d){ return x(d.age); }) .attr("cy", function(d){ return y(d.value); })

以下是如何设置比例：

var responseScale = d3.scale.linear()
.domain(d3.extent(data, function(d){
    return d.responses;
}))
.range(2, 15);

以下是数据样本：

var data = [
{glazed: 3.14, jelly: 4.43, powdered: 2.43, sprinkles: 3.86, age: 18, responses: 7},
{glazed: 3.00, jelly: 3.67, powdered: 2.67, sprinkles: 4.00, age: 19, responses: 3},
{glazed: 2.00, jelly: 4.00, powdered: 2.33, sprinkles: 4.33, age: 20, responses: 3},

我尝试在d.responses前加上一个加号并使用parseFloat（）。

代码是本课程中使用的示例，Learning to Visualize Data with D3.js（创建散点图章节）

任何建议都将不胜感激！

Answer 1

在您的代码中：

var responseScale = d3.scale.linear()
.domain(d3.extent(data, function(d){
    return d.responses;
}))
.range(2, 15);

range（）函数的参数应该是一个值数组，如下所示：.range（[2,15]）;

更正后的比例：

 var responseScale = d3.scale.linear()
    .domain(d3.extent(data, function(d){
        return d.responses;
    }))
    .range([2, 15])

可以找到有关比例的更多信息here。如果您仍然遇到麻烦，请告诉我！

D3散点图代码中<circle>属性r =“NaN”的值无效

1 个答案: