我应该如何使用 svg 元素构建树结构？

我的目标是构建一个可点击的树结构；每个节点都是一个 SVG 圆，点击它应该会显示它的（以前隐藏的）子节点。一开始只有根节点是可见的。节点应该以一种不那么分散的方式定位自己，我想这的实现将涉及设置一个类似弹簧的拉力来控制每个节点的 x 和 y 坐标。

我正在学习 React 并设置了一个函数来对构成节点的所有 SVG 元素进行编码；我现在的问题是定位。我希望能够完全控制每个 SVG 元素的坐标，但我担心我不知道如何正确地做到这一点 - 我应该为所有节点定义一个唯一的 svg 容器吗？我应该以某种方式将它们分组吗？

我在这里很迷茫。非常感谢任何帮助！