我正在用D3（v4）编写一个树来显示特定类型的数据，其中结构具有非常多的级别。因此，我决定异步加载每个新级别的数据：当用户点击一个节点时，我加载异步它的子节点。
我达到了预期的效果，但我不确定这是最好的方法，因为我觉得我正在改写方向盘。有人可以确认我的代码或告诉我更好的方式来满足我的需求吗？我在互联网上找不到关于d3和这种异步的一切......
这是简化的代码：
树初始化
00 00点击代码
// Starting data
var data = {
"name": "node1",
"children": [{
"name": "child1",
"children": []
}, {
"name": "child2",
"children": []
}]
};
// Tree creation
var root = d3.hierarchy(data);
我期望某种自动化来简化这段代码（主要是添加节点而不用担心树的每个属性的更新）。
Ps：我试图重新创建整个树，将新数据添加到初始数据并重新调用function click(d) {
loadChildrenFromServer(d, fooCallback);
}
function loadChildrenFromServer(d, callback) {
//Simulating server call
setTimeout(function () {
//Mock async data
var mockchildren = [{
"name": "asyncChild1",
"children": []
}, {
"name": "asyncChild2",
"children": []
}];
d.data.children = children; //Updating data
d.children = []; //Initializing d3 node children
children.forEach(function(dchild, index) {
//Building 'Node' objects and adding them to children
nodeData.children[index] = makeD3Node(dchild, d, index);
});
//Updating all height attributes
updateHeightAttributeRecursively(d);
callback();
}, 100)
}
function makeD3Node(data, parent, index) {
//I have to use d3.hierarchy because d3 Node constructor is not public
var node = d3.hierarchy(data);
node.parent = parent;
node.depth = parent.depth + 1;
node.children = null;
node.data = data;
node.height = 0;
node.id = parent.id + '' + index;
//updating my other attributes...
return node;
}
，但它会激活我的动画。
提前致谢！