RenderingVideo 文档
SVG 元素
渲染 inline SVG 或远程 SVG 文件
SVG 元素
svg 元素用于渲染 inline SVG,适合 logo、矢量插画和简单图形组合。
结构
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
{
"assets": {
"svgs": [
{
"id": "logo",
"svg": "<svg viewBox=\"0 0 100 100\">...</svg>"
}
]
}
}
示例
{
"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
}
]
}