在没有标题行的 d3.js 中访问 CSV 文件答案

【问题标题】：accessing CSV file in d3.js with no header row在没有标题行的 d3.js 中访问 CSV 文件
【发布时间】：2016-10-19 16:31:27
【问题描述】：

我有一个包含如下数据的 CSV 文件：

,tests,Mary,Joe,Frank
0,Test1,92,15,72
1,Test2,74,25,70
2,Test3,30,65,50
3,Test4,82,80,48

此数据取自以空格分隔的文本文件，转换为 pandas 中的数据框，然后转换为 csv 文件以用于 d3.js 驱动的散点图。

我想将数据绑定到点，这样散点图上的每个点都会保存类似的信息

studentname: Joe
Test1: 15
Test2: 25
Test3: 65
Test4: 80

针对每个学生和每个测试。我有一个类似的功能

d3.csv('path/to/file.csv', function(error, data) {
    if error throw error;
    data.forEach(function(d) {
         d.studentname = d.name;
         d.test = d.tests;
         d.score = d.studentscore;
    })});

我知道它不会以我想要的方式访问数据。我怎样才能获得正确挑选出我想要的数据的功能？

【问题讨论】：

标签： javascript python csv d3.js

【解决方案1】：

首先，您的 CSV 将不起作用，因为您没有标题中第一个元素的名称。

如果你这样做了，并且你阅读了数据集的第一个元素，你会得到类似的东西：

randomname(this i made up) : 0
tests : Test1
mary : 92
joe : 15
frank : 72

因此，要以您想要的格式获取它，您必须循环并创建一个新的数据集，类似这样（请记住，我将它转换为 JSON 以便在 JSFiddle 中轻松使用）。也可能有更简单的方法：

创建单个学生对象：

var newData = [];

for (var i in data[0]) { //create individual student objects
  if (i != 'randomname' && i != 'tests') {
    newData.push({
      studentName: i 
    })
  }
}

创建数组以获取单个学生的索引。我这样做是为了更容易检索单个学生对象以提供测试数据：

var elementPos = newData.map(function(x) {
    return x.studentName; //create array to get index of each student
  });

现在遍历数据，找到每个学生并给他们一个测试分数：

for (var i = 0; i < data.length; i++) { //loop through data
  for (var j in data[i]) { //loop through each element in data[i]
    if (j != 'tests' && j != 'randomname') { //get all students test scores
      var thisStudent = newData[elementPos.indexOf(j)]; //get student object array based on index
      thisStudent["test" + i] = data[i][j]; //set testscore, incremented
    }
  }
}

工作小提琴：https://jsfiddle.net/thatOneGuy/h7b2p2eh/1/

工作代码：

var data = [{
  "randomname": 0,
  "tests": "Test1",
  "Mary": 92,
  "Joe": 15,
  "Frank": 72
}, {
  "randomname": 1,
  "tests": "Test2",
  "Mary": 74,
  "Joe": 25,
  "Frank": 70
}, {
  "randomname": 2,
  "tests": "Test3",
  "Mary": 30,
  "Joe": 65,
  "Frank": 50
}, {
  "randomname": 3,
  "tests": "Test4",
  "Mary": 82,
  "Joe": 80,
  "Frank": 48
}];

var newData = [];

for (var i in data[0]) { //create individual student objects
  if (i != 'randomname' && i != 'tests') {
    newData.push({
      studentName: i 
    })
  }
}


var elementPos = newData.map(function(x) {
    return x.studentName; //create array to get index of each student
  });

for (var i = 0; i < data.length; i++) { //loop through data
  for (var j in data[i]) { //loop through each element in data[i]
    if (j != 'tests' && j != 'randomname') { //get all students test scores
      var thisStudent = newData[elementPos.indexOf(j)]; //get student object array based on index
      thisStudent["test" + i] = data[i][j]; //set testscore
    }
  }
}



console.log(newData)

【讨论】：