Javascript 单击行dc.datable时如何更改颜色而不丢失过滤

我有以下问题,， 当我在dc.js中单击表格的行时，我想用另一种颜色标记背景，而不会丢失已完成的过滤

我注意到命令

dc.redrawAll();

不允许填充行的底部，但如果删除它，则单击时将无法过滤其他图形

tabla.on('pretransition', function (table) {
                 table.selectAll('td.dc-table-column')
                                .on('click',function(d){
                if(filterKeys.indexOf(d.key)===-1)
                  filterKeys.push(d.key);
                else
                  filterKeys = filterKeys.filter(k => k != d.key);
                if(filterKeys.length === 0)
                  foodim.filter(null);
                else 
                    foodim.filterFunction(function(d) {
                    return filterKeys.indexOf(d) !== -1;
                  })
                 //dc.redrawAll();
                });


     table.selectAll('tr.dc-table-row')
                .on('click',function(d){

                     console.log($(this))
                    if($(this).hasClass('bg-info')){
                        $(this).removeClass('bg-info'); 
                } else {
                    $(this).addClass('bg-info').siblings().removeClass('bg-info');
                }
                 })

});

谁能帮帮我吗。

---

我首先在手机上尝试了这个，我认为hover掩盖了你想要的效果，所以我没有看到任何一种方式

在可能的情况下，最好让样式由数据驱动，而不是让许多不同的事件处理程序独立工作来更改样式

在这种情况下，重画似乎会导致表替换元素，从而丢失类注释

相反，我们可以根据行的键是否在

filterKeys

中，以及在

pretransition

处理程序中教表如何应用类：

                 table.selectAll('tr.dc-table-row')
                   .classed('bg-info', function(d) {
                       return filterKeys.indexOf(d.key)!==-1;
                   });

现在我们得到了想要的效果。我认为这段代码也更容易推理

此外，我发现引导的悬停效果使选定行悬停时的效果消失。这是因为它有一个更具体的选择器。因此，我添加了一个更具体的选项：

.table-hover>tbody>tr.bg-info:hover>td {
  background-color: #6EaEe6;
}

---

你的小提琴叉子：

我看不出在启用或禁用该行的表中有任何区别-它只是禁用了过滤。我遗漏了什么？当我点击表格中的一行时，我需要过滤器（这会改变背景的颜色）。我想在另一个图形上进行筛选。当我单击表的行时，Dc.redrawall不会同时保留这两个选项。