D3.js Tree Expand All and Collapse All

Question

I\'m building a Tree using D3.js and what I am trying to do is add two buttons, Expand All and Collapse All to the top of the page like this.

Answer 1

just add this

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

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


                            $("#expand_button").click(function(){
                                source.children.forEach(expand);
                                update(source);
                            });


                            $("#collapse_button").click(function(){
                                root.children.forEach(collapse);
                                update(root);
                            });