For html2canvas font-family is not working

Question

While converting png using html2canvas and later on I will draw that image on canvas. And I am using multiple font in html. But while converting font is not apply. So it looks different font

  function getCanvas() {
       form.width(myPageSize).css('max-width', 'none');
       return html2canvas(form, {
           useCORS: true,
           imageTimeout: 2000,
           removeContainer: true
       });
   }

Hello! It is always a good idea to show your code along with your question so that we can see exactly whats going on. Or, you can always link a jsfiddle too! Thanks. — Chris, Oct 04 '18 at 14:21
Please check above code form is element I am using Arial font directly not embedded using css — Nikhil Arote, Oct 05 '18 at 05:34

score 0 · Answer 1 · answered Oct 05 '18 at 07:01

0

actually issue is with multiple font used in html so while converting image it fails for font. Now it is gets fixed and now only using single font

answered Oct 05 '18 at 07:01

Nikhil Arote

11
1
3

score 0 · Answer 2 · edited Oct 05 '18 at 07:16

html2canvas(element, {
   onrendered: function (canvas) {
        var ctx = canvas.getContext('2d');
        ctx.webkitImageSmoothingEnabled = true;
        ctx.mozImageSmoothingEnabled = true;
        ctx.imageSmoothingEnabled = true;
        var img = canvas.toDataURL('image/png');
        console.log(img);
   }
})

I have tried this above code for my project, In this code 'element' is your html element for which you want to generate image.

For html2canvas font-family is not working

2 Answers2