请问D3如何读取csv文件的各列,或者分解成array?

读取的代码如下:

<script>
d3.csv("data.csv", function(error, d){
    if(error){
        console.log(error);
    }
    console.log(typeof(d));    //输出number
    console.log(d.total);    //输出undefined
    console.log(d["姓名"]);    //输出undefined
    });
</script>

应该是读取后不被认为是对象导致的,请问应该怎么读取呢?样例数据如下:

姓名,语文,数学,total

小明,86,94,180

小华,83,78,161

小丽,76,100,176

以下答案由GPT-3.5大模型与博主波罗歌共同编写:
可以使用d3.csv的回调函数,将csv文件转化为一个包含多个对象的数组,数组中每个对象都表示一行数据,该对象的属性名对应着csv文件的列名。可以使用d3.tsv()函数,来读取和分析tab分隔符的文件。

下面是对你的代码进行修改,输出每行数据的信息:

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

  // 打印整个CSV文件的信息
  console.log(data);

  // 遍历所有行
  data.forEach(function(d) {

    // 打印每行数据的信息
    console.log(d);

    // 输出姓名、语文、数学、总分的信息
    console.log(d.姓名);
    console.log(d.语文);
    console.log(d.数学);
    console.log(d.total);

    // 将字符串类型的数据转换为数字类型
    d.语文 = +d.语文;
    d.数学 = +d.数学;
    d.total = +d.total;

    // 打印转换后的数据类型
    console.log(typeof d.语文); // "number"
    console.log(typeof d.数学); // "number"
    console.log(typeof d.total); // "number"

  });
});

注意,csv文件的第一行必须是标题行,否则默认第一行数据会被解析为列名。

更多关于d3的各种数据加载和解析函数的使用方法,可以参考d3 API Reference文档。
如果


d3.text("data.csv").then(function(data) {
    var parsedData = d3.csvParse(data);
    console.log(parsedData);
});

引用ChatGPT部分参考:
D3可以通过d3.csv()方法来读取csv文件并返回数据。当读取csv文件时,D3会将每一行作为一个对象,其中对象的键值对为csv文件中的每一列的名称和对应值。
你可以使用d3.csv()方法读取csv文件,并在回调函数中处理数据。下面是一个简单的例子:

d3.csv("data.csv", function(error, data) {
  if (error) throw error;

  // 将数据转换为数值类型
  data.forEach(function(d) {
    d.语文 = +d.语文;
    d.数学 = +d.数学;
    d.total = +d.total;
  });

  // 在控制台输出数据
  console.log(data);
});

在上面的代码中,我们首先使用d3.csv()方法读取data.csv文件。随后,在回调函数中,我们打印出data(已读取和处理的csv文件),并将语文、数学和total列从字符串类型转换为数值类型。
这样,你就可以访问每一行的数据了,比如:

data.forEach(function(d) {
  console.log(d.姓名); // 输出每一行的姓名
});