简体   繁体   English

如何使用javascript生成带有图表数据的表格?

[英]How to generate a table with a chart data using javascript?

I have a javascript chart built with thу use of Amcharts.我有一个使用 Amcharts 构建的 javascript图表 I need to generate a table as below that would take data from the same scv file that I use for the chart.我需要生成一个如下表,该表将从我用于图表的同一个 scv 文件中获取数据。

How can I make it?我怎样才能做到?

You can create dynamicly table with JSON:您可以使用 JSON 动态创建表:

Javascript Javascript

 var table = document.createElement("table");

        // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE.

        var tr = table.insertRow(-1);                   // TABLE ROW.

        for (var i = 0; i < col.length; i++) {
            var th = document.createElement("th");      // TABLE HEADER.
            th.innerHTML = col[i];
            tr.appendChild(th);
        }

        // ADD JSON DATA TO THE TABLE AS ROWS.
        for (var i = 0; i < YourData.length; i++) {

            tr = table.insertRow(-1);

            for (var j = 0; j < col.length; j++) {
                var tabCell = tr.insertCell(-1);
                tabCell.innerHTML = YourData[i][col[j]];
            }
        }

        // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER.
        var divContainer = document.getElementById("showData");
        divContainer.innerHTML = "";
        divContainer.appendChild(table);

Your HTML:你的 HTML:

 <p id="showData"></p>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM