使用SPFx中的PDFJS的PDF中的模糊/拉伸字体

问题描述

我正在开发一个Webpart以使用SPFx中的jsPDF库生成PDF。

也遇到过几篇文章，但是没有找到我一直在寻找的解决方案

我能够生成PDF，但是PDF中的字体看起来模糊且拉伸

下面是转换为PDF的HTML页面的代码

 public render(): React.ReactElement<ICertificateProps> {
    return (
    
<div><br/><br/>
<div id="Cert">
<div id ="MyCertificate"><br/><br/>
<h1 id="cert-title">
  Certificate of Proficiency
</h1>
<br/>

<p className="smaller" id="cert-declaration">
  THIS IS TO CERTIFY THAT
</p>

<h1 id="cert-holder">
  {this.state.Name}
</h1>

<p className="smaller" id='cert-completed-line'>
  has successfully completed the
</p>

<h2 id="cert-course">
  Course in {this.state.Course}
</h2>

<br/>
<p id="cert-from" className="smaller">
  &nbsp; from LMS365
</p>

<br/>
<p className="smaller" id='cert-issued'>
 <b>Issued on:</b> {this.state.date}.
</p>
</div>
</div>
      <button onClick={this.documentprint}>Save Certificate </button>
</div>
     
    );
  }

将HTML转换为PDF的功能

public documentprint = (e) => {  
    e.preventDefault();  
    const myinput = document.getElementById('Cert');  
    html2canvas(myinput,{scale: 4})  
      .then((canvas) => {   
        const imgData = canvas.toDataURL('image/jpeg',1.0);  
        const mynewpdf = new jsPDF('p','mm',[200,200]);
        var position = 0;  
        mynewpdf.addImage(imgData,'JPEG',position,200,200);  
        mynewpdf.save("Certificate.pdf");  
      });  
  }  

下面是供您参考的屏幕截图。

Blurry/Stretchy font in PDF

任何帮助将不胜感激。

谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）