如何使用d3.csv()检查CSV中的值类型?

时间:2018-01-09 06:54:39

标签: javascript csv d3.js

我想知道在读取数据时,D3或普通JavaScript中是否有任何方法可以即时检查数据类型。

例如,如果我想阅读"iris.csv"使用d3.csv()制作一个盒子图,有没有办法检查sepal_lengthsepal_width,{ {1}}和petal_length是数字变量而petal_width是分类变量?

1 个答案:

答案 0 :(得分:4)

让我们看一个可能的解决方案,使用您链接的CSV:

sepal_length,sepal_width,petal_length,petal_width,species
5.1,3.5,1.4,0.2,setosa
4.9,3.0,1.4,0.2,setosa
4.7,3.2,1.3,0.2,setosa
4.6,3.1,1.5,0.2,setosa
etc...

由于d3.csv所有内容转换为字符串,因此您无法立即typeof



d3.csv("https://gist.githubusercontent.com/curran/a08a1080b88344b0c8a7/raw/d546eaee765268bf2f487608c537c05e22e4b221/iris.csv", function(data) {
  var variables = data.columns;
  variables.forEach(function(d) {
    console.log("typeof " + d + ": " + typeof(data[1][d]))
  })
})

<script src="https://d3js.org/d3.v4.min.js"></script>
&#13;
&#13;
&#13;

但是,我们可以使用isNaN来检查该字符串是否包含数字(警告:无法使用null或空字符串正常工作):

&#13;
&#13;
d3.csv("https://gist.githubusercontent.com/curran/a08a1080b88344b0c8a7/raw/d546eaee765268bf2f487608c537c05e22e4b221/iris.csv", function(data) {
  var variables = data.columns;
  variables.forEach(function(d) {
    console.log(d + " is: " + (isNaN(data[0][d]) ? "categorical" : "numeric"))
  })
})
&#13;
<script src="https://d3js.org/d3.v4.min.js"></script>
&#13;
&#13;
&#13;

正如您所看到的,我们只需要data.columns来获取标题,然后我们只需要第一行值(data[1],而不是data[0])。实际上,可以使用除第一行(data[0])之外的任何行。

修改

您在comments

中提问
  

您是否有更多了解如何处理数据集中的缺失值/ null或空字符串?

一种简单的方法是检查值是否为假...

!data[index][d]

...然后转到下一行,直到找到合适的值:

var index = 1;
while (data[index][d] === "null" || data[index][d] === "") {
    ++index;
}

这是演示,我在CSV中放了一些null和空字符串,看看:

&#13;
&#13;
var csv = `sepal_length,sepal_width,petal_length,petal_width,species
null,,null,0.2,setosa
null,3.0,1.4,,setosa
null,3.2,1.3,0.2,null
4.6,3.1,1.5,0.2,setosa
5.1,3.5,1.7,0.2,setosa`;

var data = d3.csvParse(csv);

var variables = data.columns;
variables.forEach(function(d) {
  var index = 1;
  while (data[index][d] === "null" || data[index][d] === "") {
    ++index;
  }
  console.log(d + " is: " + (isNaN(data[index][d]) ? "categorical" : "numeric"))
})
&#13;
<script src="https://d3js.org/d3.v4.min.js"></script>
&#13;
&#13;
&#13;