convert div into image data using jquery

Question

I have a html page. In which I have a button, whenever I click this button it should convert the entire html page into data image. I achieved this by using html2canvas as follow:

html2canvas([document.getElementById('form1')], {
        onrendered: function (canvas) {
            var imageData = canvas.toDataURL('image/jpeg',1.0); 
     }
    });

It is giving me the image data but without checkboxes and radio buttons. So is there any alternative to convert the html page to image data using jquery or javascript??
If there, please help me to come out from this problem.
Thank you in advance.

Answer 1

You're only converting the part in form1

document.getElementById('form1')

Try using

html2canvas(document.body, {
    onrendered: function (canvas) {
        var imageData = canvas.toDataURL('image/png',1.0); 
 }
});