Question

我使用此代码以图像格式获取图表，但图表未满，部分出现。可以帮我吗，谢谢

function genrateImage(){
 alert("genrateImage");
 var svgs = document.getElementsByTagName("svg");
 var totalHeight = svgs[0].getBoundingClientRect().height;
 var totalWidth = svgs[0].getBoundingClientRect().width;
 var c = document.createElement("canvas");
 c.setAttribute("height",totalHeight);
 c.setAttribute("width",totalWidth);
 ctx = c.getContext("2d");
 var marginX = 10, marginY = 10;
 var image64 ;
 for(i=0;i<svgs.length;i++){
   var xml = new XMLSerializer().serializeToString(svgs[i]);
   var svg64 = btoa(xml);
   var b64Start = 'data:image/svg+xml;base64,';
   image64 = b64Start + svg64;
   var svgSize = svgs[i].getBoundingClientRect();          
   var img= document.createElement("img");
   img.setAttribute("src", image64);
   ctx.drawImage(img, marginX, marginY);
   ctx.save(); 
   marginX += svgSize.width + 20;        
 };   
 var imgsrc = c.toDataURL("image/png");
 var a = document.createElement("a");
 a.download = "Sample.png";        
 a.href = imgsrc;        
 a.click();
 a.remove();

}

Answer 1

我使用dom2image.js它将给出正确的结果

全图不来，局部来

1 个答案: