在dc.js和datatables.net下的DataTable搜索框和分页

Question

我正在使用dc.js 数据表，我想添加搜索框和分页使用dataTables.net过滤我的dataTable中的数据。

我现在拥有什么？

在我的 js 文件中我有这个：

var datatable = $('#dc-data-table');

然后是我的数据表的定义：

dc.dataTable('.dc-data-table')

        .dimension(Mydimension)

        .group(function(d) { 
               // some code;
                            })
        .size(dataSet.length)

        .columns([


            {
                label: '<B>'+'column1'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column2'+'</B>',
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column3'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column4'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column5'+'</B>', 
                format: function (d) {



                    return // some code;


                }
            },
            {
                label: '<B>'+'column6'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column7'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column8'+'</B>', 
                format: function (d) {
                    return // some code;
                }
            },
            {
                label: '<B>'+'column9'+'</B>', 
                format: function (d) 
            {              
                    return // some code;
                   }
           },

           {
                label: '<B>'+'column10'+'</B>', 
                format: function (d) {
                    return // some code;
                  }
                }

           ])


        .sortBy(function (d) {
            // some code;
        })

        .order(d3.ascending)

        .renderlet(function (table) {
            table.selectAll('.dc-table-group').classed('info', true);
        });

在我的 Html 文件中我有这个：

<table class="table table-hover dc-data-table"> </table>

我已关联了两个 css 文件 bootstrap.min.css和dc.css：

结果：

我想要的是什么：

正如您所看到的，我有很多行，我想激活分页并使用搜索框来过滤DataTables.net示例中的数据。< / p>

提前感谢;