JsPDF Autotable：如何並排顯示兩個跨越多個頁面的表格？

Question

我正在嘗試使用Autotable並排顯示兩個表的信息。當我沒有那麼多條目並且信息只需要一個頁面時，它顯示正常。但是，當我有很多數據和多個頁面時，第二個表格不會開始顯示，直到第一個表格顯示其大部分條目。

下面是帶示例數據的JsFiddle來說明問題。我試着改變第二個表格的y位置，但它似乎只是將數據向上移動到它正在顯示的頁面上，並切斷了數據的頂部，而不是將它移動到前面的頁面上。

function generatePdf() { 
     header = ["Reason","Duration","Start time"]; 
    content = [ 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"], 
       ["Analyzer blowback","10h15m","08:04"] 

         ]; 

    var doc = new jsPDF('p', 'pt'); 
    doc.autoTable(header, content, { 
     showHeader: 'firstPage', 
     styles: { fontSize: 10 }, 
     avoidPageSplit: true, 
     margin: { right: 305 } 
    }); 

    doc.autoTable(header, content, { 
     showHeader: 'firstPage', 
     styles: { fontSize: 10 }, 
     avoidPageSplit: true, 
     margin: { left: 305 } 
     }); 

    doc.save("test.pdf") 
} 

generatePdf(); 

Answer 1

我不得不解決庫中的一件事情，以便啓用此功能，因此您需要做的第一件事就是更新到v2.3.1版本。第二件事是在繪製表格之間手動設置正確的頁面。我有工作代碼更新您的fiddle，但它基本上可以這樣做：

var startingPage = doc.internal.getCurrentPageInfo().pageNumber; 
doc.autoTable(header, content, {margin: {right: 305}}); 
doc.setPage(startingPage); 
doc.autoTable(header, content, {margin: {left: 305}}); 

我也更新了multiple tables example包括跨越多個表水平表。