在水平与垂直视图之间切换 Smart Tree 布局

这个示例构建了什么

这个示例围绕一份通用关系数据集构建了一个只读的 smart-tree 布局演示界面。默认视图是一个从左到右的树，节点为琥珀色矩形，连接线为曲线；同时，已经挂载的同一张图可以通过浮动窗口中的选择器切换为自上而下的预设。在自上而下模式中，节点会变成高而窄的竖向卡片，标签文字也会变为竖排，因此这个变化不仅关乎方向，也关乎可读性。

页面包含一个可拖拽的说明面板、一个用于控制滚轮和拖拽行为的设置浮层、一个内嵌的 mini-view，以及图片导出功能。这个示例最重要的思路是：布局变化时并不会重新加载另一份数据集。它会保持图已挂载的状态，并更新当前图，使每一种朝向都保持清晰可读。

数据是如何组织的

图数据是一个内联的 RGJsonData 对象，包含 rootId: 'root'、41 个节点和 40 条有向连线。它采用扁平结构而不是嵌套结构：节点以 { id, text } 对象数组声明，关系则以 { from, to, text } 边来声明。这使得该示例更接近通用的有向关系数