D3.js D3从csv文件创建表,该文件具有多列且没有标题

D3.js D3从csv文件创建表,该文件具有多列且没有标题,d3.js,D3.js,我试图在html表中显示多列csv(没有标题)中的数据。我在网上搜寻答案,但我认为不存在答案。也许有一个是这样的,我错过了,但请不要只是让我参考网上的一些帖子,因为我已经尝试了所有的帖子,但我仍然被卡住了。我看到的每个示例都有标题或是一列。同样,我的csv文件没有标题,并且有多个列。看起来像这样 2.051392,2.045899 2.04834,2.049256 2.051697,2.053833 所以,正如互联网上所说的,我将d3.csv.parserows函数传递到d3.text函数

我试图在html表中显示多列csv(没有标题)中的数据。我在网上搜寻答案,但我认为不存在答案。也许有一个是这样的,我错过了,但请不要只是让我参考网上的一些帖子,因为我已经尝试了所有的帖子,但我仍然被卡住了。我看到的每个示例都有标题或是一列。同样,我的csv文件没有标题,并且有多个列。看起来像这样

2.051392,2.045899

2.04834,2.049256

2.051697,2.053833
所以,正如互联网上所说的,我将d3.csv.parserows函数传递到d3.text函数中。然后将列名分配给标题行。在我将数据分配给td元素之前,一切都很好。代码生成具有列属性“ch1”和“ch2”的td元素,但td元素的value属性返回undefined。当我用行[0]或行[1]替换行[column]时,value属性返回一个值,因此我知道数据在那里。我错过了什么

换句话说

value: row[column] //returns a value of undefined
value: row[0] //returns the first value in the row as expected
value: row[1] //returns the second value in the row as expected
我不明白为什么行[列]不返回值

function tab_data(data,columns)
{
var table = d3.select("#tabulatedData").append("table").attr("border","1"),
thead = table.append("thead"),
tbody = table.append("tbody");

// append the header row
thead.append("tr")
.selectAll("th")
.data(columns)
.enter()
.append("th")
.text(function(column) { return column; });

// create a row for each object in the data
rows = tbody.selectAll("tr")
.data(data)
.enter()
.append("tr");

// Create a cell in each row for each column
var cells = rows.selectAll("td")
.data(function(row) {
return columns.map(function(column) {

return {
column: column,
value: row[column]
}; 

});
})
.enter()
.append("td")
.html(function(d) {

return d.value;

});




//main function

window.onload = function()

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

data = d3.csv.parseRows(unparsedData);

tab_data(data,["ch1","ch2"]); 

});

}
我是通过如下编辑代码来实现的,尽管必须有一个更优雅的解决方案。我认为d3的好处是for循环已经成为过去

// Create a cell in each row for each column
var cells = rows.selectAll("td")
    .data(function(row) {
        return columns.map(function(column) {

            for(var i = 0; i<columns.length; i++)
            {
                row[columns[i]] = row[i];
            }

            return {
                column: column,
                value: row[column]
            };  

        });
    })
    .enter()
    .append("td")
    .html(function(d) {

        return d.value;

    });
//在每行中为每列创建一个单元格
变量单元格=行。选择全部(“td”)
.数据(功能(行){
返回columns.map(函数(列){

对于(var i=0;i您在哪里为列指定名称?我在您发布的代码中没有看到任何这样做的内容。当我在主程序中调用tab_data()函数时,我会传递列名“ch1”和“ch2”。这个名为columns的名称数组随后在tab_data()中使用函数为每一列指定一个名称。我这样做是否有误?我正在寻找类似于
row[column]=row[index]的内容
。您具体在哪里分配头?您在那里修改的是DOM,而不是数据。只要它解决了您的问题。我同意它不是特别漂亮,但D3也不是真正用于像那样的低级数据操作。