预览带平铺背景的图谱图片
这个示例在平铺重复背景上渲染左到右 relation-graph 树图,并把准备后的完整场景捕获为内联预览图片。它是“预览优先”图谱导出的聚焦参考,适用于需要把装饰性背景一并纳入生成位图的场景。
通过平铺背景层预览完整图谱图像
这个示例构建了什么
这个示例在 relation-graph 中渲染了一棵大型的从左到右技术树,并把准备好的场景转换为内联截图预览。可见结果是一个白色节点层级结构,带有弯曲的带标签连线,并通过 RGBackground 在图谱画布内部叠加了重复的 PNG 平铺背景和浅色调背景层。
用户可以点击 Generate Image,在浮动窗口中查看捕获后的位图,拖动或最小化该窗口,并打开一个共享设置面板来调整滚轮模式、拖拽模式和下载行为。这个示例的核心要点是针对带装饰图谱场景的“先预览再导出”流程,而不是图谱编辑,也不是一个已确认的 RGWatermark 实现。
数据如何组织
图谱数据在 initializeGraph() 中以内联方式声明为一个静态的 RGJsonData 对象。它使用 rootId: '2'、一个扁平的 nodes 数组,以及一个扁平的 lines 数组,其中每条连线都带有重复的标签 Subsystem。
这里没有 fetch 步骤,也没有在布局前执行预处理。组件创建这个数