html - Converting more than one SVG element to PNG in Javascript -
i have simple chart uses 3 d3.js svg elements display different stuff. want convert png. found solution on here:
function saveimage(){ var html = d3.selectall("svg") .attr("version", 1.1) .attr("xmlns", "http://www.w3.org/2000/svg") .node().parentnode.innerhtml; var imgsrc = 'data:image/svg+xml;base64,'+ btoa(html); var img = '<img src="'+imgsrc+'"/>'; d3.select("#svgdataurl").html(img); console.log(html); };
now works fine, if use 1 svg element, if try this, error:
this page contains following errors: error on line 1 @ column 419: content @ end of document
column 419 is, of course directly between first closing < /svg> tag , next opening < svg> tag.
is possible convert 3 elements 1 picture using javascript?
i'm not familiar d3.js ,
before that, have know that, code working single svg? got error on multiple svg used right?
if is, try following code
function saveimage(){ var html = d3.selectall("svg") .attr("version", 1.1) .attr("xmlns", "http://www.w3.org/2000/svg") .node().parentnode.innerhtml; for(var i=0;i<html.length;i++) { var imgsrc = 'data:image/svg+xml;base64,'+ btoa(html[i]); var img = '<img src="'+imgsrc+'"/>'; d3.select("#svgdataurl").html(img); console.log(html[i]); } };
Comments
Post a Comment