Question

我基本上想将SVG转换为PNG图像。所以我将SVG转换为SVG图像，并尝试在画布上绘制它，以便能够通过toDataURL（）方法将其作为PNG。这在Chrome中运行良好，但在Firefox中它会产生一个非常无意义的错误：NS_ERROR_NOT_AVAILABLE

经过一番搜索和实验，我尝试了一个不同的SVG源，突然间一切正常。任何可能导致该方法对第一个SVG字符串工作正常但第二个字符串失败的想法？如何更改SVG以使其正常工作？

小提琴：http://jsfiddle.net/3AXwb/

var image = new Image();
image.src = 'data:image/svg+xml,' + escape(xml);
image.onload = function () {
    var canvas = document.createElement('canvas');
    canvas.width = image.width;
    canvas.height = image.height;
    var context = canvas.getContext('2d');
    document.getElementById('container').appendChild(canvas);
    context.drawImage(image, 0, 0);
}

Answer 1

将width属性添加到外部<svg>元素。例如。宽度=＆＃34; 450＆＃34;

第一种情况是宽度和高度，第二种情况是高度，Firefox目前要求宽度和高度都存在。

在Firefox中的画布上下文对象上使用svg调用drawImage（）的问题

1 个答案: