d3.js - 如何使用 d3 动态更新嵌套列表？

Question

我有带有树结构的 JSON。我这样渲染它：

var lis = d3.select("#active ul")
    .selectAll("li")
    .data(getTopLevelChildren(), nodeId);
lis.enter().append("li").each(makeNodeView);

makeNodeView递归地做同样的事情，在 DOM中创建一个ul/树。li

但是，我也想动态更新列表。这个直截了当的代码不起作用：

lis.each(updateNodeView);
lis.exit().remove();

问题是递归地selectAll("li")选择了所有li节点。因此删除页面上任何位置的所有标签，除了树根处的标签。lis.exit().remove()li

如何一次只选择 1 个级别的树？

score 2 · Accepted Answer

var ul = d3.select(this).append("ul");
var lis = ul.selectAll(function () { return ul[0][0].childNodes })

1 回答 1