Jspdf: background color in jspdf.js

[nitin0708]

Hi

I have a problem when generating pdf using jspdf, it showing background color black.

Thanks

Nitin

[MrRio]

Do you have any example code?

[nitin0708]

var canvas = $("#mynetwork canvas").get();
var ctx=canvas[0].getContext("2d");
ctx.fillStyle = '#ffffff'; // or whatever color
var imgData = canvas[0].toDataURL('image/jpeg');
var doc = new jsPDF();

doc.addImage(imgData, 'JPEG', 15, 60, 180, 160);
doc.output('dataurlnewwindow');

[nitin0708]

Can anyone verify the above code.

[reidark]

Try:

html{
    background: #fff !important;
}

[Rodeoclash]

Can confirm that setting a background colour on the html element fixed a problem with black backgrounds. Perhaps we can close this issue?

[encantador-coder]

@reidark - Tried your fix. Setting the background color on the html element does not work. The image in the PDF still has a black background. I am using the JPEG type:
canvas.toDataURL("image/jpeg", 1.0)

[Karl-Xu]

Hi，The problem still exists，who has a solution?
My code like this：

--------code begin
var doc = new jsPDF("p", "mm", "a4");

doc.addImage(canvas.toDataURL("image/jpeg",1), 'JPEG', 10, 10, 190, 277);

doc.output('dataurlnewwindow');
--------code end

The result like this：https://pan.baidu.com/s/1mhEsEEG
Question time: 5/8/2017

[isabas]

İf you are converting html to canvas after adding to pdf you have to be careful. converted html has to appear at screen. Black background is unseen part of canvas while creating pdf.(Html to canvas is like screenshoot of monitor)

[Karl-Xu]

Thank you, I have found the problem and fixed it.

在 2017年9月25日，15:46，isabas [e-mail] 写道：

İf you are converting html to canvas after adding to pdf you have to be careful. converted html has to appear at screen. Black background is unseen part of canvas while creating pdf.(Html to canvas is like screenshoot of monitor)

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub https://github.com/MrRio/jsPDF/issues/508#issuecomment-331802595, or mute the thread https://github.com/notifications/unsubscribe-auth/AEE18WMyeVOSAYZExSm-wBowTY2lPu_Zks5sl1pGgaJpZM4Ek5il.

[ShirlyChan]

请问是怎么解决的，我也遇到了同样的问题 @Karl-Xu

[Karl-Xu]

就是因为你的canvas截图缩放后和pdf页（假设是A4页）的高度不一样，不能完全覆盖。源码是没有找到在哪改，那么只能用蠢办法，就是计算一下未覆盖区域，然后再画一个白底矩形上去。

On Dec 1, 2017, at 11:12, Shirly Chan [e-mail] wrote:

请问是怎么解决的，我也遇到了同样的问题 @Karl-Xu https://github.com/karl-xu
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub https://github.com/MrRio/jsPDF/issues/508#issuecomment-348389780, or mute the thread https://github.com/notifications/unsubscribe-auth/AEE18URDavMmKWl_JGJxanEJ1leV4TL6ks5s726XgaJpZM4Ek5il.

[ShirlyChan]

get√，谢谢~ @Karl-Xu

[emeraldsoft]

for me converting using PNG instead of JPEG solve the problem