多个力布局相同的页面

Question

我正在尝试创建一个强制布局，其中并非所有节点都与链接连接。另外，在点击节点时，我得到了一些极好的帮助（参考问题here）。

我想将两者结合在一起，但有点卡住了。

我创建了一个JSFiddle，我修改了原始数据，而不是每个节点都有链接;但是，正如您从小提琴中看到的那样，只绘制了一个节点，并且没有显示任何其他节点。

数据看起来像这样：

[
                {   "name": "cluster",
                    "children": [
                        {"name": "AgglomerativeCluster", "size": 3938},
                        {"name": "CommunityStructure", "size": 3812},
                        {"name": "HierarchicalCluster", "size": 6714},
                        {"name": "MergeEdge", "size": 743}
                    ]
                },
                {
                    "name": "graph",
                    "children": [
                        {"name": "BetweennessCentrality", "size": 3534},
                        {"name": "LinkDistance", "size": 5731},
                        {"name": "MaxFlowMinCut", "size": 7840},
                        {"name": "ShortestPaths", "size": 5914},
                        {"name": "SpanningTree", "size": 3416}
                    ]
                },
                {
                    "name": "optimization",
                    "children": [
                        {"name": "AspectRatioBanker", "size": 7074}
                    ]
                }
]

我不确定，但在我尝试时似乎在我看来： var nodes = flatten(root)这会导致一些问题。

我发现了一些在单个svg中显示多个强制布局的示例，但我认为当我通过点击重新居中时会出现一些问题。