# 🎄 Tree algorithm 🎄 ![](https://i.imgur.com/VT4mGLm.png) ```javascript // Original tree data ``` ![](https://i.imgur.com/0gxw8Pv.png) --- ### Step 1: 😍 ```javascript // 1) Get all the strings in the tree const allStrings = getAllStrings(treeData); ``` ![](https://i.imgur.com/lP1WDPX.png) --- ### Step 2 & 3:😌 ```javascript // 2) Get all depth based on string position // 3) Add parent metadata only from 2nd node const allStringsWithDepth = addDepthAndParentToNode(allStrings); ``` ![](https://i.imgur.com/DX0kyzl.png) --- ### Step 4:🤔 ```javascript // 4) Get node overview with title, depth and count const nodesOverview = generateNodesOverview(allStringsWithDepth); ``` ![](https://i.imgur.com/TfHLibB.png) --- ### Step 5:🤔🤔🤔 ```javascript // 5) Get number of layers in a tree const numberOfLayers = getNumberOfLayers(nodesOverview); // => Returne 3 ``` --- ### Step 6: 😱😱😱 ![](https://i.imgur.com/Y4hxhVw.png) ```javascript // 6) Add placeholder node to all the strings const completeStrings = addPlaceholderNodeToString( allStringsWithDepth, numberOfLayers ); ``` ![](https://i.imgur.com/qQgcfpz.png) --- ### Step 7: 🙏 ```javascript // 7) Build our new tree backbone with depth and widthCount from nodeOverview const tree = generateTreeBackbone( completeStrings, nodesOverview, numberOfLayers ); ``` ![](https://i.imgur.com/R4F5wD6.png) --- ### Step 8: 🤭 ```javascript // 8) Based on depth & count, calculate the position for each node let layers = appendPositionsToNode(tree, HORIZONTAL_SPACING); const treeHeight = getTreeHeight(layers); ``` ![](https://i.imgur.com/nSB9Qk8.png) --- ### Step 9: 🙃🙃🙃 ```javascript // 9) Mirror the node if it's CA if (isRotated) { layers = appendPositionsTMirrorNode(layers, treeHeight); } ``` ![](https://i.imgur.com/zEwBlf1.png) ![](https://i.imgur.com/mOkDkZG.png) --- ### Bonus 🤩🤩🤩: How to move 2 trees together? ![](https://i.imgur.com/dKHZUj7.png)