如何在d3中使用带有分层数据的数据属性

Question

我有一个基本上是树的数据集，但我认为我不应该使用层次结构布局，因为我想要绘制的内容不像树？

我尝试使用.data函数更新我的图表但是在尝试将其与分层数据一起使用时遇到了麻烦。所以我的问题是：

我的数据最初类似于此：

var data = [{
    "name" : "A",
    "hasChildren" : true,
    "children" : [
        {
            "name" : "B",
            "hasChildren" : false
        },
        {
            "name" : "C",
            "hasChildren" : true
         }
     ]
}];

我甚至不知道如何开始使用.data进行此类更新，因此我没有工作原型，因此我将尽力描述：

所以为了代表A，我有一个200 x 200的正方形，因为它有两个孩子。广场是可点击的，因为A的一个孩子C有孩子。当我点击广场时，我得到了新数据：

var data = [{
    "name" : "A",
    "hasChildren" : true,
    "children" : [
        {
            "name" : "B",
            "hasChildren" : false
        },
        {
            "name" : "C",
            "hasChildren" : true,
            "children" : [
                {
                    "name" : "D",
                    "hasChildren" : false
                }
             ]
         }
     ]
}];

并且绘制了一个新的方块来代表C的子节点，它是100x100，因为它只有一个子节点并使用D来绘制该正方形。 （我知道我可以把孩子的数量作为一个数据，但我尝试做的是使用新信息来绘制）

希望我的解释足够清楚：p。

这只是我想要做的基本想法。有人可以向我解释如何使用.data检查嵌套表单中的更新，然后根据它更新图表吗？

谢谢！