创build链接到csv文件的表格
我正在尝试使用d3创build一个链接到*.csv文件的表格，但是我得到的只是一个空白的网页。 即使克里米亚的例子，我得到一个空白页面。
我将不胜感激，指导或展示一个我正在做的错误的实例或build议。
如果您要求从CSV数据创build一个HTML表格，这是你想要的：
d3.csv("data.csv", function(data) { // the columns you'd like to display var columns = ["name", "age"]; var table = d3.select("#container").append("table"), 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 var 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") .text(function(d) { return d.value; }); });
看看这个工作的例子 。 如果您要复制代码，则需要更新tabulate()函数，以便select现有的表格或不同的容器（而不是"#container" ），然后可以像这样使用CSV数据：
d3.csv("path/to/data.csv", function(data) { tabulate(data, ["name", "age"]); });
@Shawn_allen提出的答案有一个错误。
要解决它，只需更改以下代码行
return {column: column, value: row[column]};
通过这一个
return {column: column, value: row[columns.indexOf(column)]};
请享用 ！
通常，我需要定期刷新数据表。 以下是我如何使用数据填充表格：
HTML：
<table id="t1"> <thead> <tr><th>Name<th>Age </thead> </table>
JavaScript的：
function tabulate(data, columns) { var table = d3.select("#t1"); table.select('tbody').remove(); // remove any existing data var tbody = table.append('tbody'); data.forEach(function(row) { var tr = tbody.append('tr'); columns.forEach(function(column) { tr.append('td').text(row[column]); }); }); return table; }
笔记：
- 我喜欢在HTML中放置表头，而不是从JavaScript生成它们。
- 我没有将数据附加到表格行和单元格（就像@Shawn在答案中所示），因为我不需要这些。 所以代码更简单。
小提琴
对不起，添加这个作为一个新的答案，但我没有足够的观点添加它作为评论。 稍微调整一下@Shawn_Allen代码的结尾。 我相信这也是有效的。
//create a cell in each row for each column var cells = rows.selectAll("td") .data(function(row) { return columns.map(function(column) { return row[column]; }); }) .enter() .append("td") .text(function(d) { return d; });
}）;
没有必要创build与列，值的JSON。
