2014-09-11 41 views
2

我正在处理一个SVG图形导出(使用d3.js库)到PNG。问题是标签textPath。导出到PNG时,文本不会显示。有谁知道这个问题是否有解决方案?问题Textpath svg到PNG

的代码我用做转换是:

var svgString = new XMLSerializer().serializeToString(document.querySelector('#svg')); 

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

var DOMURL = self.URL || self.webkitURL || self; 
var img = new Image(); 
var svg = new Blob([svgString], {type: "image/svg+xml;charset=utf-8"}); 
var url = DOMURL.createObjectURL(svg); 

img.onload = function() { 
    ctx.drawImage(img, 0, 0); 
    var png = canvas.toDataURL("image/png"); 
    var a = document.createElement("a"); 
    a.download = "grafico.png"; 
    a.href = png; 
    a.click(); 
    DOMURL.revokeObjectURL(png); 
}; 
img.src = url; 

非常感谢你的所有。 问候, Sonia

回答

1

固定。我已经解决了在CSS样式表中的属性,如:

font-size: 16px; 
color: black; 
fill: none; 
0

这里同样的问题。看来这种转换方法没有得到人体的字体大小。但是,将生成的SVG转储到.svg文件并在浏览器中打开该文件可正确呈现。