仅在D3中选择子集

是否可以仅在D3中选择子集/子组？

现在我有

d3.selectAll(".row")

现在在行下方我有单元格，我想从第3行中选择所有单元格，如本图像子集示例所示。没有Get(3(或[3]选项。

谢谢您的帮助。

d3.selectAll(".row").selectAll(".cell")

给我所有细胞

做到这一点的许多方法。我最喜欢的是使用CSS :nth-child选择器：

d3.select(".row:nth-child(3n)").selectAll(".cell");

这是其他一些：

<!DOCTYPE html>
<html>
  <head>
    <script data-require="d3@4.0.0" data-semver="4.0.0" src="https://d3js.org/d3.v4.min.js"></script>
  </head>
  <body>
    <div class="row">
      <div class="cell">a</div>
      <div class="cell">b</div>
      <div class="cell">c</div>
    </div>
    <div class="row">
      <div class="cell">d</div>
      <div class="cell">e</div>
      <div class="cell">f</div>
    </div>
    <div class="row">
      <div class="cell">g</div>
      <div class="cell">h</div>
      <div class="cell">i</div>
    </div>
    <div class="row">
      <div class="cell">j</div>
      <div class="cell">k</div>
      <div class="cell">l</div>
    </div>
  </body>
  
  <script>
    
    var w1 = d3.select(document.querySelectorAll(".row")[2]).selectAll(".cell"),
        w2 = d3.selectAll(".row").filter((d,i) => i === 2).selectAll(".cell"),
        w3 = d3.select(d3.selectAll(".row").nodes()[2]).selectAll(".cell"),
        w4 = d3.select(".row:nth-child(3n)").selectAll(".cell");      
  
  </script>
</html>

相关内容

最新更新

热门标签：