天天看點

java html表格 pdf檔案_JSPDF - 将圖像和HTML表附加到同一pdf檔案

我嘗試使用jsPDF導出谷歌圖表和HTML表格 . 由于谷歌圖表無法導出,我建立了一個圖像,并使用pdf.addImage()将其添加到pdf . 然後使用'pdf.fromHTML()'方法将表附加到相同的pdf檔案 . 提供更高的上邊距值以在圖像下方顯示它 .

function exportChart() {

var pdf = new jsPDF('p', 'pt', 'letter');

//Creating the image from chart and adding to the pdf

var img = document.getElementById("graphImg");

var canvas = document.createElement("canvas");

canvas.width = img.width;

canvas.height = img.height;

var ctx = canvas.getContext("2d");

ctx.drawImage(img, 0, 0);

var dataURL = canvas.toDataURL("image/png");

pdf.addImage(dataURL, "PNG", 100,20);

canvas = null;

//Adding the html table to the same pdf file

source = $('#graphDiv')[0];

specialElementHandlers = {

'#bypassme': function (element, renderer) {

return true;

}

};

margins = {

top: 300, // Providing high top margin value to make the table below to the image

bottom: 60,

left: 80,

width: 400

};

pdf.fromHTML(

source,

margins.left,

margins.top, {

'width': margins.width,

'elementHandlers': specialElementHandlers

},

function (dispose) {

pdf.save('Export.pdf');

}, margins);

}

當表格較小時,一切正常并且pdf導出完美,但是當表格大小時,某些行會附加到新的pdf頁面,但是上邊距為300.這會在第二頁中産生大量空白 . 請幫忙解決這個問題 .