如何创建一个动态表格 - Crossfilter - dc.js

Question

如何创建一个动态表格，就像Crossfilter首页上的航空准点率示例中那样。

http://square.github.io/crossfilter/

- Shalomi90

Answer 1

虽然它不是完整功能，但您可以使用dc.js dataTable来实现此目的：

https://github.com/dc-js/dc.js/blob/develop/web/docs/api-latest.md#dc.dataTable

对于更华丽的表格，一些人成功地集成了DataTables.js。

https://github.com/dc-js/dc.js/issues/966

- Gordon

Answer 2

我用的是这个。而且它很有效 :)

 <div class="row">
        <table id='data-table'>
            <thead>
            <tr class='header'>
                <th>TestCase</th>
                <th>TestScript</th>
                <th>MonType</th>
            </tr>
            </thead>
        </table>
    </div>



dc.dataTable('#data-table')
        .dimension(TestCaseDim)
            .group(function (d) {
                return d.Timestamp.bold().fontcolor("darkblue");
            })
        .columns([
            function (d) { return d.TestCase; },
            function (d) { return d.TestScript; },
            function (d) { return d.MonitorType; }

        ])
        .size(500) 
        .order(d3.descending)
        .renderlet(function (table) {
            table.selectAll('.dc-table-group').classed('info', true);
        });

- Shalomi90