D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
cool-Blue
Full window
Github gist
build table from csv
<!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>
https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js