d3缩进树关闭其他带有子节点的节点并仅打开特定节点答案

【问题标题】：d3 indented tree close other nodes with child and open only specific noded3缩进树关闭其他带有子节点的节点并仅打开特定节点
【发布时间】：2015-06-05 05:19:02
【问题描述】：

您好，我将使用这个 jsfiddle 作为参考 http://jsfiddle.net/Ge58Q/16/

 function expandSingle(d) {
  if (d._children) {
    d.children = d._children;
    d._children = null;
 }
}

如您所见，我有一棵有多个分支的树。我想要做的是onload，我只希望NODE LIGHTNING 有一个打开的孩子，那就是NODE TURBO。 NODES CUTE 和 NODE TOXIC 我希望他们的孩子被隐藏起来。这是否可以只打开我想要的特定节点?????????

我觉得跟上面的代码有关系

【问题讨论】：

这样的？ jsfiddle.net/Ge58Q/17
动态表示它会扩展路径到具有特定值的节点？例如你输入turbo，它会用turbo值扩展节点的路径？
完全一样，但从根到目标节点。如果树有很多树枝，它们的树枝需要靠近。我只想显示从根到目标节点的路径而不打开其他节点的子节点

标签： javascript php d3.js tree

【解决方案1】：

如果您想将路径从根扩展到具有特定名称的节点，您可以使用一些算法来获取路径，例如深度优先与存储路径的堆栈。下面是封装递归函数并返回索引为children从根到节点位置的数组的函数示例：

function getPathToNode(val, rootNode) {
    var stack = [];
    var nodeFound = false;
    function getPathRec(node) {
        if (nodeFound) {
            return;
        }
        if (node._children || node.children) {
            var nodeChildren = node.children ? node.children : node._children;
            for (var i=0; i<nodeChildren.length; i++) {
                if (!nodeFound) {
                    stack.push(i);
                    getPathRec(nodeChildren[i]);
                }
            }
        }
        if  (node.name == val && !nodeFound) {
            nodeFound = true;
            return;
        } else if (!nodeFound) {
            stack.pop();
        }
    }
    getPathRec(rootNode);
    return stack;
}

然后你可以展开路径上的节点：

function expandToNode(val) {
    path = getPathToNode(val, flare);
    currentNode = flare;
    for (var i=0; i<path.length - 1; i++) {
        currentNode = currentNode.children[path[i]];
        expandSingle(currentNode);
    }
}

所以只需调用函数expandToNodes(val)，节点名称为val parameter：

expandToNode('turbo');

这是工作的 JSFiddle：http://jsfiddle.net/Ge58Q/18/

限制：如果有多个具有确切名称的节点，它只会扩展第一个找到的节点。如果您想扩展所有路由，您可以遍历整个根并返回所有路径。我仅使用您的树数据测试了代码，因此可能存在一些错误。

【讨论】：

嗨@knives22 我很高兴我的回答很有帮助！