在更新时对表行进行排序和筛选

Question

我正在尝试根据年份变化的数据更新表格。问题是我只想显示数据的子集（10个项目），这与sort函数一起使用效果不佳。当我删除过滤器功能时，动态排序值工作正常，但显示所有数据。使用过滤功能时，排序功能不起作用，并显示按字母顺序排列的前10个项目。有关如何正确集成过滤器功能的任何建议吗？我是否需要通过update，exit，remove？

再次绑定数据

这是我的代码：

var rows_cotton = tbody_cotton.selectAll("tr")
      .data(all)
      .sort(function(a, b){ return d3.descending(parseInt(data_cotton_pc()[a.id]), parseInt(data_cotton_pc()[b.id])); })
      .enter()
      .append("tr")
      .filter(function(d,i) { return i < 10 })

    var cells_cotton_name = rows_cotton
      .append("td")
        .attr("class","column_name")
        .text(function(d,i){return nameById[d.id];})

    var cells_cotton_bar = rows_cotton
      .append("td")
      .attr("class","column_bar")
        .append("svg")
          .attr("width", 180)
          .attr("height", 5)
          .append("rect")
            .attr("height", 5)
            .attr("width", function(d) { return table_bars(parseFloat(data_cotton_pc()[d.id])); })
            .attr("fill","#BA3459")

    var cells_cotton_number = rows_cotton
      .append("td")
      .attr("class","column_number")
        .text(function(d,i){return data_cotton_pc()[d.id];})

这是我的更新功能：

      rows_cotton
      .sort(function(a, b){ return d3.descending(parseInt(data_cotton_pc()[a.id]), parseInt(data_cotton_pc()[b.id])); });

      cells_cotton_name
        .text(function(d,i){return nameById[d.id];})

      cells_cotton_bar
            .attr("width", function(d) { return table_bars(parseFloat(data_cotton_pc()[d.id])); })

      cells_cotton_number
        .text(function(d,i){return data_cotton_pc()[d.id];});