在画布中获取SVG的SVGDocument？

Question

我正在尝试找到一种方法来更改SVG文件中元素的填充，然后通过JavaScript将其绘制到画布上。

我设法将.svg文件实际绘制到画布的唯一方法是创建一个Image对象，并将其图像源设置为SVG文件。不过这样做，我找不到在图像对象上使用getSVGDocument()的方法。

有什么建议吗？

*的 *增加：

这是我通过<object>标签更改svg文件填充的方式，这非常有效：

var svg = document.getElementById('character').getSVGDocument();
var hairColor = document.getElementById('_hair').value;
var headColor = document.getElementById('_head').value;
var bodyColor = document.getElementById('_body').value;

svg.getElementById("hair").style.fill = hairColor;
svg.getElementById("head").style.fill = headColor;
svg.getElementById("body").style.fill = bodyColor;

然后它访问的HTML元素如下：

<object id="character" type="image/svg+xml" data="person.svg">

基本上我想做同样的事情，但只是在<canvas>标签内，所以我可以在游戏设置中动态移动svg。