Question

我有100个<rect>元素，我试图根据数据对象使用D3进行选择和修改。属性。

例如：

[Object, Object]
    0: Object
        name: "john"
        count: 32
    1: Object
        name: "jane"
        count: 48

我基本上想做一些版本：

d3.selectAll(rect)
    .data(data)
    .attr('class', function(d) { return d.name });

...这样前32个<rect>有class="john"，后48个<rect>有class="jane"，其余20个<rect>有没有上课。

现在它只是根据对象的数量进行分类 - 即第一个<rect>有class="john"，第二个有class="jane"，其他98个没有课程，但我无法弄清楚如何在这里实现所期望的行为...

Answer 1

最好的方法可能是在创建<rects>时添加此课程信息。但是，如果由于某种原因您的设置不允许，那么您应该拥有一个数组，其元素数量与您拥有的<rects>数量相同。 .data()作用于数组中的所有元素，并且每个<rects>（在您的情况下）都继承了数组中每个元素中包含的信息： https://github.com/mbostock/d3/wiki/Selections#Data

现在，当您执行第二个代码块时，您只更新到2 <rects>，因为您的数组只包含2个对象。那么你可以做的是创建另一个包含100个元素的数组，每个元素都有你想要的类：）

如果您有任何其他问题，请与我们联系！

根据对象属性将数据绑定到现有数量的元素

1 个答案: