我正在寻找像你这样的一个非常类似的解决方案,并通过这样做解决了我的问题。
// Toggle children on click.
function click(d) {
if (d.children) {
d._children = d.children;
d.children = null;
} else {
d.children = d._children;
d._children = null;
}
update(d);
}
我改变了给定的一个比特:
function click(d) {
if (!d.children && !d._children) {
var nameOfTheFile = d.jsonPath;
var childObjects;
d3.json(nameOfTheFile, function(error, json) {
childObjects = json;
childObjects.forEach(function(node) {
if(node.name != d.name){
(d._children || (d._children = [])).push(node);
}
});
if (d.children) {
d._children = d.children;
d.children = null;
} else {
d.children = d._children;
d._children = null;
}
update(d);
});
} else {
if (d.children) {
d._children = d.children;
d.children = null;
} else {
d.children = d._children;
d._children = null;
}
update(d);
}
}
说明: 我添加了一个属性,以我的节点,其中定义了一个休息服务URL,它返回给我一个JSON文件和给定节点的子节点(这里您也可以将路径放置到JSON文件本身)。如果click(d)方法中的给定节点在其数组中没有任何子节点,那么我读取该属性并调用URL来提取他的子节点。返回的孩子我推到d._children数组并运行正常的逻辑(也是更新方法)。
因此,您可以在没有一个大的JSON文件的情况下,按需加载节点的子节点。对我而言,这是一个非常好的解决方案。感谢Distributed json loading in force collapsable layout,这个想法来自哪里。