如何将SVG图像添加到javascript html5画布动画？

<canvas id="myCanvas" width="500" height="500"></canvas>

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

var img = new Image();
img.src = "path/to/your/svg/image.svg";

img.onload = function() {
  ctx.drawImage(img, x, y, width, height);
};

function animate() {
  // 清除画布
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  
  // 更新图像位置或其他属性
  // ...
  
  // 绘制图像
  ctx.drawImage(img, x, y, width, height);
  
  // 请求下一帧动画
  requestAnimationFrame(animate);
}

// 启动动画
animate();