2016-11-30 107 views
-1

我使用html2canvas.js和mPDF库。html2canvas,我想提高质量

所以myproject的过程是HTML DIV捕获 - >的base64/PNG - > MPDF(IMG SRC = “数据/ ~~~~”)

但MPDF视图图像是低质量的。我想要中等质量或高质量。

我使用html2canvas源这个

function html2img(){ 
    var canvas =""; 
    html2canvas($("#SavePart"), { 
    onrendered: function(canvas) { 
    // canvas is the final rendered <canvas> element 
    document.getElementById("theimage").src = canvas.toDataURL(); 
// console.log(canvas.toDataURL()); 
//  Canvas2Image.saveAsPNG(canvas); 

    var o_hidden = document.createElement("input"); 
    o_hidden.type = "hidden"; 
    o_hidden.name = "data"; 
    o_hidden.value = canvas.toDataURL(); 
    test.appendChild(o_hidden); 

    document.test.submit(); 
    } 
    }); 

} 

MPDF CODE

$html.='<img src="data:image/jpg;base64,'.$image_data.'" />'; 

如何图像质量呢?

+0

不是问题,但是' - > base64/png - >' - 但是你使用'data:image/jpg' - 惊讶它显示,说实话 - 我猜测浏览器是否可以检测mimetype你的意思是“而不是你”所做的“ –

+0

对不起我的错误。 –

+0

查看https://github.com/niklasvh/html2canvas/issues/241 – 0xcaff

回答

0

您可以使用此

var imgURi = canvas.toDataURL("image/png",1.0);

欲了解更多信息,你可以阅读​​文档。

+0

谢谢,但是这段代码(var imgURi = canvas.toDataURL(“image/png”,1.0);)change var imgURi = canvas.toDataURL(“image/jpeg”,1.0);正确的过程。 –