DC JS:如何在单击时突出显示聚合数据表中的行,类似于行图表?

@哈桑有正确的想法。我只建议选择 tr 而不是 td s,而不是在单击时更改类(这在重绘之后将不复存在),而是在 pretransition 事件。

所以:

tr.dc-table-row.sel-rows {
     background-color: lightblue;
}

marketTable.on('pretransition', function (table) {
    table.selectAll('td.dc-table-column')
      .on('click', /* ... */)
    table.selectAll('tr.dc-table-row')
        .classed('sel-rows', d => filterKeys.indexOf(d.key) !== -1)
  });

我们根据行的键是否在数组中应用类。简单明了!

Fork of your fiddle.

在onclick事件中,添加(切换)类似的类 .sel-rows 单击项目(而不是更改项目的背景色)。现在在您的CSS中添加:

.sel-rows td{
     background-color: gray;
}

在某些浏览器中,表格行的背景色不起作用。