Тип шрифта отличается в HTML и холст

Question

Я использую html2canvas LIB, чтобы сделать свой HTML-страницу с изображением, а затем я положил, что в PDF с помощью jspdf. Но каким-то образом мой шрифт html-страницы отличается от шрифта в файле PDF.

$scope.ConvertToPdf = function(obj){ 
     $scope.downloadPdfArr = []; 
     $scope.downloadPdfArr = angular.copy(obj); 

     html2canvas($("#widget"),{ 
      onrendered : function(canvas){ 

       var imgData = canvas.toDataURL(
        'image/png');    
       var doc = new jsPDF(); 
       doc.addImage(imgData, 'PNG', 10, 10,200,100); 
       doc.save('sample-file.pdf'); 


      } 
     }) 
    } 

Это моя страница HTML

Это PDF Я получаю

Answer 1

html2canvas не претендует на обрабатывать все типы styling - если на вашей странице есть свойство font-style, возможно, это неправильно обрабатывается или вообще не обрабатывается. Он может отличаться и между браузерами - какой браузер вы используете для получения этого результата?

Вы можете попробовать отладить источник html2canvas в инструментах разработчика, таких как функции Font (family, size) и cloneNode (node, javascriptEnabled), чтобы увидеть, как именно обрабатывается HTML-страница вашей страницы, и посмотрите объекты узла DOM.