Question

我正在使用SVG文本路径，我需要将其转换为常规HTML画布。为此我将SVG转换为blob文件并将其“下载”为图像。然而，似乎在将SVG转换为blob时，firefox会在某处崩溃，文本路径在此过程中会完全丢失。

这是问题的一个小提琴：http://jsfiddle.net/ne5s2r1d/

var image = new Image();
var serializer = new XMLSerializer();
var data = serializer.serializeToString(document.getElementById("w3SVG"));

var blob = new Blob([data], {
    type: 'image/svg+xml'
});

var DOMURL = window.URL || window.webkitURL || window;
var url = DOMURL.createObjectURL(blob);

image.onload = function () {

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

    canvas.width = canvas.height = 256;
    document.body.appendChild(canvas);

    ctx.drawImage(image, 20, 20);

    DOMURL.revokeObjectURL(url);
}

image.src = url;

var canvas2 = document.createElement("canvas");
var ctx2 = canvas2.getContext("2d");
document.body.appendChild(canvas2);

适用于IE10 +，Opera，Chrome但不适用于Firefox。（当前稳定版本）似乎firefox完全忽略了路径元素。

关于如何解决这个问题的任何想法？我试过Canvg，但它不支持文本路径，而Kinetic似乎在firefox中创建了渲染工件，更不用说它缺少一些关键的SVG功能。

Firefox SVG2Blob没有按预期工作

0 个答案: