# SVG 元素

`svg` 元素用于渲染 inline SVG，适合 logo、矢量插画和简单图形组合。

## 结构

```ts
interface SvgClip extends BaseClip {
  type: "svg";
  svg?: string | { $ref: string };
  src?: string | { $ref: string };
}
```

## 字段

- `svg`：inline SVG 字符串，或引用 `assets.svgs[].svg`。
- `src`：远程或资产引用的 SVG 文件地址。当前会按图片方式渲染，适合只展示、不需要拆分 SVG 子节点动画的场景。

如果需要可动画路径，请使用独立的 `path` 或 `line` 元素。

## assets

```json
{
  "assets": {
    "svgs": [
      {
        "id": "logo",
        "svg": "<svg viewBox=\"0 0 100 100\">...</svg>"
      }
    ]
  }
}
```

## 示例

```json
{
  "type": "svg",
  "start": 0,
  "duration": 4,
  "svg": { "$ref": "logo" },
  "transform": {
    "x": "50%",
    "y": "50%",
    "width": 320,
    "height": 320
  },
  "animations": [
    {
      "type": "rotate",
      "from": -8,
      "to": 8,
      "duration": 1.6,
      "loop": true
    }
  ]
}
```