将屏幕上的csv文本转换为表格

时间:2018-12-27 19:15:55

标签: jquery d3.js

我有一个div类,其中包含以下csv的原始文本:

mutations

有没有一种方法可以加载此div并将其显示为表格,而不仅仅是html渲染上的原始文本?

我发现下面的代码可以工作,但仅适用于加载实际文件。如何修改它以在div类中加载内容并在其下方加载csv样式表。

<div class="weh">
    Jones, Smith, and Company
    test, meow
</div>

1 个答案:

答案 0 :(得分:2)

只需从DOM中提取文本

var csvText = d3.select("#weh").text();

var csvText = d3.select("#weh").text();
console.log(csvText);
var parsedCSV = d3.csv.parseRows(csvText);
console.log(parsedCSV);
var container = d3.select("body")
    .append("table")

    .selectAll("tr")
      .data(parsedCSV).enter()
      .append("tr")

    .selectAll("td")
      .data(function(d) { return d; }).enter()
      .append("td")
        .text(function(d) { return d; });
table, td { border: 1px solid #000000; }
td { padding: 0.5em; }
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

<div id="weh" style="display:none;">Jones,Smith,Company
test,meow,foofoo
</div>