1

我正在尝试找到一种方法来更改 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。

4

0 回答 0