在JavaScript中从base64创建SVG

Question

我是javascript新手。

我想从base64创建SVG。我正在尝试http://jsfiddle.net/XTUmV/28/， 但没有显示任何内容。

 var image="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
 var svgimg = document.createElementNS("http://www.w3.org/2000/svg", "image");
 svgimg.setAttributeNS("http://www.w3.org/1999/xlink", 'xlink:href', image);

 document.getElementById("mySvg").appendChild(svgimg);

和html：

 <svg id="mySvg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"></svg>

base64应该是正确的，因为我从此http://jsfiddle.net/MxHPq/示例中获取了它

我在做一些愚蠢的事情或只是错误的方法？

谢谢

Answer 1

您忘了给<image>标签加上一些尺寸：

var image="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
var svgimg = document.createElementNS("http://www.w3.org/2000/svg", "image");
// new
svgimg.setAttribute( 'width', '100' );
svgimg.setAttribute( 'height', '100' );

svgimg.setAttributeNS("http://www.w3.org/1999/xlink", 'xlink:href', image);


document.getElementById("mySvg").appendChild(svgimg);

编辑小提琴