修复jsPDF中的模糊文本

时间:2017-11-02 20:12:10

标签: canvas jspdf html2canvas

In this plunk我有一个div应该使用jsPDFhtml2canvas转换为PDF。问题是输出PDF中的文本是模糊的,边框而不是虚线是实心的。有办法解决这个问题吗?

HTML

<button type="button" onclick="download()">Convert to PDF</button>
<br/><br/>
<div id="div1" style="border:1px dashed red;background-color:yellow">
  <h4>This text will be converted to canvas, then to image and then to PDF</h4>
</div>
<p>
This text will not be included
</p>

的Javascript

var download = function(){
    html2canvas(document.getElementById("div1"), {
            onrendered: function(canvas) {
                var imgData = canvas.toDataURL('image/png');
                var doc = new jsPDF('p', 'mm');
                doc.addImage(imgData, 'PNG', 10, 10);
                doc.save('sample2.pdf');
            }
        });
    };

2 个答案:

答案 0 :(得分:0)

这对我有帮助

我定义了

Option Explicit
Public Function GetTabName(ByVal tabIndex As Long) As String
    Dim ws As Worksheet
    On Error GoTo Errhand
    Set ws = ThisWorkbook.Worksheets(tabIndex)
    If ws.Visible Then
        GetTabName = ThisWorkbook.Worksheets(tabIndex).Name
    Else
        GetTabName = "N/A"
    End If
Errhand:
    If Err.Number <> 0 Then
        Select Case Err.Number
        Case 9
            GetTabName = "Sheet not found"
        End Select
    End If
End Function

我希望对您有用

答案 1 :(得分:0)

<script src="https://unpkg.com/jspdf@latest/dist/jspdf.min.js"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-beta4/html2canvas.js"></script>
<script src="https://cdn.bootcss.com/html2pdf.js/0.9.1/html2pdf.js"></script>    
  • jspdf.min.js
  • html2canvas.js
  • html2pdf.js


var element = document.getElementById('divContents');
html2pdf(element, {
                margin: 0,
                filename: 'myfile.pdf',
                image: { type: 'jpeg', quality: 1 },
                html2canvas: { scale: 2, logging: true },
                jsPDF: { unit: 'in', format: 'a4' }
});