我正在尝试导入具有以下列顺序的 csv:
country,2004,2008,2012
eu 28 none,,11.1,12.8
eu 28 one language,,35.7,36.6
eu 28 two languages,,53.1,50.6
eu 27 none,8.3,11.2,12.9
eu 27 one language,54.7,35.9,36.7
eu 27 two languages,,52.9,50.3
做完
d3.keys(csv[0])
列以某种方式导入为:
["2004", "2008", "2012", "country"]
为什么会这样？我使用列顺序作为应该显示什么符号的鉴别器，所以这对我来说是个大问题。
使用到的部分代码
d3.csv( folder + "/" + file, function(csv) {
var allheaders = d3.keys(csv[0]);
console.log(d3.keys(csv[0]));
最佳答案
将其作为文本文件引入，然后您可以利用 d3.cvs.parseRows() 返回数组的事实。这意味着顺序将按照原文。
你的代码的根本问题是 d3.csv 返回一个 objects 数组，对象成员的顺序没有定义，这是一个 javaScript事情...
#Working Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
div {
white-space: pre;
}
td, th {
outline: 1px solid white;
background-color: #ccc;
}
th {
text-align: left;
}
td:not(:first-child) {
text-align: right;
}
</style>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<!--<script src="d3 CB.js"></script>-->
<script>
d3.text("data.csv", function (text) {
var csv = d3.csv.parse(text), allheaders = d3.csv.parseRows(text)[0],
table = d3.select("body").append("table");
table.append("thead")
.append("tr").selectAll("th")
.data(allheaders).enter()
.append("th")
.text(function(d){return d});
table.append("tbody").datum(csv)
.selectAll("tr")
.data(function(d){
return d
})
.enter().append("tr")
.selectAll("td")
.data(function(row){
return allheaders.map(function(h) { return row[h]})
}).enter().append("td")
.text(function(d) {
return d
});
});
</script>
</body>
</html>
关于javascript - D3.js csv 文件中的列顺序错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31183691/