web-dev-qa-db-ja.com

生成されたワードラップPDF(jsPDFを使用)?

私がやっていることは、jsPDFを使用して、生成したグラフのPDFを作成します。ただし、タイトルを折り返す方法はわかりません(text()関数を使用して追加))。タイトルの長さはグラフごとに異なりますが、現在、私のタイトルはページ外に流れています。

これは私がこれまでに持っているコードです:

var doc = new jsPDF();
doc.setFontSize(18);
doc.text(15, 15, reportTitle);
doc.addImage(outputURL, 'JPEG', 15, 40, 180, 100);
doc.save(reportTitle);

ReportTitleがページからはみ出さないようにするものはありません

30
user3749946

さて、これを解決しました。 jsPDF関数splitTextToSize(text、maxlen、options)を使用しました。この関数は、文字列の配列を返します。幸い、ドキュメントへの書き込みに使用されるjsPDF text()関数は、文字列と文字列の配列の両方を受け入れます。

var splitTitle = doc.splitTextToSize(reportTitle, 180);
doc.text(15, 20, splitTitle);
73
user3749946

JSPDFの自動ページングとテキストラップの問題は、次のコードで達成できます。

 var splitTitle = doc.splitTextToSize($('#textarea').val(), 270);
    var pageHeight = doc.internal.pageSize.height;
    doc.setFontType("normal");
    doc.setFontSize("11");
    var y = 7;
    for (var i = 0; i < splitTitle.length; i++) {                
        if (y > 280) {
            y = 10;
            doc.addPage();
        }
        doc.text(15, y, splitTitle[i]);
        y = y + 7;
    }
    doc.save('my.pdf');
6
KB1788

新しい行を動的に追加する必要がある場合は、doc.splitTextToSizeによって返される配列にアクセスし、各行を移動するときに垂直方向のスペースを追加します。

var y = 0, lengthOfPage = 500, text = [a bunch of text elements];

//looping thru each text item
for(var i = 0, textlength = text.length ; i < textlength ; i++) {

    var splitTitle = doc.splitTextToSize(text[i], lengthOfPage);

    //loop thru each line and output while increasing the vertical space
    for(var c = 0, stlength = splitTitle.length ; c < stlength ; c++){

        doc.text(y, 20, splitTitle[c]);
        y = y + 10;

    }

}