节点数据模型（JsonNode / RGNode）

节点是 relation-graph 中最基础的数据单元。

实际开发中会接触两种节点对象：

• JsonNode：你输入给图谱的配置数据。
• RGNode：图谱运行时生成的节点对象。

1. JsonNode 与 RGNode 的关系

• 配置阶段使用 JsonNode。
• 运行时读取通常得到 RGNode。
• RGNode 会包含额外的运行时信息（可见性、布局计算、实际尺寸等）。

典型流程：

const nodeA = { id: 'a', text: 'Node A' };
graphInstance.addNodes([nodeA]);
const rgNodeA = graphInstance.getNodeById('a'); // RGNode

2. 必须掌握的核心字段

标识与文本

• id: string 必填且唯一。
• text?: string 节点文本。

relation-graph 使用 text，不是 label。

交互与状态

• expanded?: boolean
• selected?: boolean
• disablePointEvent?: boolean
• disableDrag?: boolean
• hidden?: boolean

视觉样式

• className?: string
• nodeShape?: RGNodeShape
• color?: string
• borderColor?: string
• borderWidth?: number
• borderRadius?: number
• fontColor?: string
• fontSize?: number
• opacity?: number

几何与位置

• width?: number、height?: number
• x?: number、y?: number
• zIndex?: number
• 运行时测量值：el_W、el_H

业务与树结构

• data?: Record<string, any> 业务扩展数据。
• children?: JsonNode[] 树结构输入快捷写法。
• type?: string 可用于按类型加样式（rg-node-type-{type}）。

3. 常见 CRUD 操作

// Create
graphInstance.addNode({ id: 'n1', text: 'N1' });
graphInstance.addNodes([{ id: 'n2', text: 'N2' }]);

// Read
const node = graphInstance.getNodeById('n1');
const allNodes = graphInstance.getNodes();

// Update
graphInstance.updateNode('n1', {
  text: 'N1 Updated',
  color: '#4ade80'
});

// Delete
graphInstance.removeNodeById('n2');

4. 实战示例

const nodes = [
  {
    id: 'root',
    text: 'Root',
    type: 'service',
    className: 'node-root',
    color: '#dbeafe',
    width: 140,
    height: 48,
    data: { owner: 'team-a' }
  },
  {
    id: 'worker-1',
    text: 'Worker 1',
    type: 'worker',
    x: 420,
    y: 180,
    fixed: true
  }
];

graphInstance.addNodes(nodes);

5. 关键注意事项

• id 必须稳定且唯一。
• 如果手动设置 x/y，不要和自动布局策略冲突。
• children 适合导入阶段；运行时是扁平化节点/连线结构。
• 未设置宽高时，布局常需要等节点尺寸测量完成后再执行。

6. 下一步阅读

• 连线数据模型
• 虚拟连线与目标
• 关联对象数据
• 图谱数据流转与修改
• 图谱状态管理