工具函数

AntV Infographic 提供了一些工具函数，方便在布局或自定义组件中复用几何计算与节点操作。

cloneElement

浅拷贝一个 JSX 节点并覆写部分属性，常用于布局中调整子元素的 x/y 或样式。

function cloneElement(
  element: JSXElement,
  props?: Partial<typeof element.props>
): JSXElement;

参数	类型	说明
`element`	`JSXElement`	要克隆的节点。
`props`	`Record<string, any>`	要覆盖或追加的属性，将与原有属性浅合并。

返回值：新的 JSXElement，原对象不变。

getElementBounds

计算单个 JSX 节点的包围盒。支持原语节点、布局组件、函数组件以及数组。

function getElementBounds(node?: JSXNode): Bounds;
// Bounds = { x: number; y: number; width: number; height: number }

参数	类型	说明
`node`	`JSXNode` \| `undefined`	任意 JSX 节点或节点数组。

返回值：Bounds。若无法推导尺寸（无子元素且无显式宽高），返回 width=0、height=0。

行为要点

布局组件（由 createLayout 生成）会先执行布局函数再计算尺寸。
函数组件优先使用显式的 width/height；若缺省，则递归测量其渲染结果。
传入数组时会递归展开并合并子节点的包围盒。

getElementsBounds

计算一组节点的整体包围盒，内部会为每个节点调用 getElementBounds 后求并集。

function getElementsBounds(elements: JSXNode): Bounds;

参数	类型	说明
`elements`	`JSXNode`	一个或多个节点（数组）。

返回值：Bounds。若数组为空或无有效节点，返回全 0。

getCombinedBounds

纯几何工具，将多个 Bounds 合并为最小包围盒，不处理节点。

function getCombinedBounds(list?: Bounds[] | null): Bounds;

参数	类型	说明
`list`	`Bounds[]` \| `null` \| `undefined`	要合并的边界集合。

返回值：Bounds。传入空值时返回全 0。

renderSVG

将 JSX 节点渲染为 SVG 字符串，方便在网页或其他环境中使用。

function renderSVG(node: JSXNode, options?: object): string;

参数	类型	说明
`node`	`JSXNode`	要渲染的 JSX 节点或节点数组。
`options`	`object \| undefined`	SVG 容器属性

返回值：SVG 字符串。

典型场景

自定义布局：用 getElementBounds 获取子节点尺寸，cloneElement 写入新的 x/y。
组件自动撑开：缺省宽高时，用 getElementsBounds 得到子内容的整体尺寸并回填自身 width/height。
组合计算：已有预计算的 Bounds 列表时，用 getCombinedBounds 合并，避免重复遍历节点树。