How to convert a image from PNG to JPEG using javascript?
Cause
The reason for this to happen is due to canvas being transparent. However the transparancy color is black with a transparent alpha-channel so it won't show on screen.
JPEG on the other side doesn't support alpha-channel so that black color which is the default is stripped of its alpha channel leaving a black background.
You PNG supports alpha-channel so it is compatible with the way canvas work.
Solution
To get around this you will have to manually draw in a white background on the canvas before you draw in the image:
var canvas = $('.jSignature')[0];
var ctx = canvas.getContext('2d');
ctx.fillStyle = '#fff'; /// set white fill style
ctx.fillRect(0, 0, canvas.width, canvas.height);
/// draw image and then use toDataURL() here