Question

在D3.js中使用data（）。enter（）。append（）后，只需使用d.valuename即可检索数据集中的各个列/值。但我想在CSV列中找到线性刻度的最大值。由于规模不在任何数据调用之前，我真的不确定如何指定从中找到最大值的正确列。

这是我失败的尝试。我用d.column1代替什么？

d3.csv("file.csv", function (data) {

var x = d3.scale.linear()
    .domain([0, d3.max(d.column1)])
    .range([0, 960]);

修改

好的，通过查看a similar example，我得到了更多。我不明白为什么我的代码现在不能正常工作。

 d3.csv("file.csv", function (data) {

 data.forEach(function(d) {
    d.column1 = +d.column1;
 });

 var max = d3.max(data, function(d) { return d.column1; });

 var x = d3.scale.linear()
     .domain([0, max])
     .range([0, 960]);

编辑＃2：

如果问题来自数据本身，这里是一个片段。我已经尝试删除所有引号，并保留除最顶行之外的所有引号，但没有任何效果。

"product", "price"
"bread",20
"meat",100
"meat, sausage",200

编辑＃3：

好的，我保证，最后编辑。但是要绝对清楚;我正在使用x刻度来确定条形图中条形的宽度：.attr("width", x)并且刻度返回NaN。

Answer 1

解释您的代码有效的原因：

data.forEach(function(d) {
  d.column1 = +d.column1;
});

以上语句将您的所有column1值转换为整数（d.column1前面的+号将类型强制转换为数字）。

一旦您的值都是数字，d3现在可以将它们作为数字而不是字符串进行比较。这种方式10将大于9.如果它们是字符串，则“9”将大于“10”。

var max = d3.max(data, function(d) { return d.column1; });

以上行只占用数据数组的最大值。由于数据数组由对象组成，因此d3无法知道如何将一个对象与另一个对象进行比较。第二个参数是一个函数，它为每个对象提供d3值，以便d3可以比较每个对象。在你的情况下，你告诉d3使用column1来确定最大值。这类似于比较器功能。

Answer 2

我刚刚意识到问题所在。难怪我们无法一起解决这个问题。上面的所有代码都很好。只是当我调用x-scale来确定条形图的宽度时，我没有指定数据中的哪一列输入到比例尺。我有

.attr("width", x)

但现在我把那行改为：

.attr("width", function(d) { return x(d.column1); })

感谢您的帮助和耐心。

使用d3.max在CSV列中查找最大值

2 个答案: