при нажатии на узел как открыть дочерний узел дочернего

у меня есть дерево из четырех узлов.Я хочу нажать на второй узел и хочу открыть непосредственно четвертый узел.
Значит я хочу открыть дочерний узел дочернего узла.
Я пытаюсь это, но не могу получить его.

1 ответ

  1. https://jsfiddle.net/5dsnucue/2/

    //Toggle children on click.
    function click(d) {
       // show is true if children currently hidden
       var show = !d.children; 
       showKids (show, d); // set the visibility of this node's kids
    
        // if on second level node and we want to show children of children
        // (don't need to same for hide, hiding intermediate node will do the job)
       if (d.depth === 1 && show) {
            var arr = d.children || d._children;
          // loop through kids and set them to visible
          arr.forEach (function(child) {
            showKids (true, child);
          })
       }
       update(d);
    }
    
    // showKids replaces simple toggle with a show parameter
    function showKids (show, d) {
      if (!show) {
             d._children = d.children;
              d.children = null;
          } else {
              d.children = d._children;
              // blank this line as calling showKids with show=true
              // twice in a row will end up nulling .children and ._children
              // so keep d._children populated.
              //
              // Same doesn't apply to the 'if' condition above as we don't
              // pursue hiding down the tree.
              //d._children = null; 
         }
    }
    

    Это позволяет выполнить следующие действия:

    1. Нажмите на узел 2-го уровня, узлы 3-го и 4-го уровня показаны
    2. Нажмите еще раз на узле 2-го уровня, узлы 3-го и 4-го уровня скрыты
    3. Нажмите еще раз на узле 2-го уровня, 3-й и 4-й узлы уровня показаны
    4. Нажмите на узел 3-го уровня, узлы 4-го уровня скрыты
    5. Нажмите на узел 2-го уровня, узел 3-го уровня скрыт
    6. Нажмите еще раз на узле 2-го уровня, 3-й и 4-й узлы уровня показаны

    Приведенный выше код может показаться немного более сложным, чем это должно быть, но с простым переключением Шаг 6 вернется в состояние шага 4 — т. е. только 3-й уровень показан. Логика в коде гарантирует, что узлы 4-го уровня всегда отображаются при развертывании узла 2-го уровня независимо от их предыдущего состояния.