データがいっぱいになったときにJSPDFが新しいページに移動

Question

私はJSPDFで新しく、のようなPDFページを作成しました。問題は、このページでデータがいっぱいになると新しいページが生成されないという問題です。私はgithubと他の解決策がスタックオーバーフローしている。解決策は得られません。 [デモリンクはこちらJSPDF] [3]

[3]：>https://jsfiddle.net/jodfkz59/7/

var data = [{ 
 
     "Name": "Ronan", 
 
     "Email": "sodales.elit@eratSed.co.uk", 
 
     "Company": "Malesuada Malesuada Ltd" 
 
    }, { 
 
     "Name": "Calvin", 
 
     "Email": "amet.nulla@Vestibulumante.ca", 
 
     "Company": "Donec Egestas Foundation" 
 
    }, { 
 
     "Name": "Kane", 
 
     "Email": "Duis.mi@consectetueradipiscingelit.net", 
 
     "Company": "Arcu Institute" 
 
    }, { 
 
     "Name": "Kasper", 
 
     "Email": "magna.Phasellus.dolor@velconvallisin.co.uk", 
 
     "Company": "Tempor LLP" 
 
    }]; 
 
    
 
    
 
    var doc = new jsPDF('p', 'pt', 'a4'); 
 
    //Dimension of A4 in pts: 595 × 842 
 
    
 
    var pageWidth = 595; 
 
    var pageHeight = 842; 
 
    var y=500; 
 
    var pageMargin = 10; 
 
    
 
    pageWidth -= pageMargin * 2; 
 
    pageHeight -= pageMargin * 2; 
 
    
 
    var cellMargin = 5; 
 
    var cellWidth = 250; 
 
    var cellHeight = 60; 
 
    
 
    var startX = pageMargin; 
 
    var startY = pageMargin; 
 
    
 
    function createCard(item) { 
 
    
 
     // doc.getTextDimensions(item.Name); turncate or split string if you needed 
 
     
 
    if (y >= pageHeight) 
 
{ 
 
    doc.addPage(); 
 
    y = 0 // Restart height position 
 
} 
 
    
 
     doc.text(item.Name, startX, startY); 
 
     doc.text(item.Email, startX, startY + 20); 
 
     doc.text(item.Company, startX, startY + 40); 
 
    
 
     var nextPosX = startX + cellWidth + cellMargin; 
 
    
 
     if (nextPosX > pageWidth) { 
 
     startX = pageMargin; 
 
     startY += cellHeight; 
 
     } else { 
 
     startX = nextPosX; 
 
     } 
 
    
 
    } 
 
    
 
    
 
    for (var i = 0; i < data.length; i++) { 
 
     createCard(data[i]); 
 
    }

Answer 1

問題は機能createCardた状態です。 yオフセットの実際の現在の値でテストを変更する必要があります。

このフィドルを参照してください：https://jsfiddle.net/jodfkz59/8/

var data = [{ 
     "Name": "Ronan", 
     "Email": "sodales.elit@eratSed.co.uk", 
     "Company": "Malesuada Malesuada Ltd" 
    }, { 
     "Name": "Calvin", 
     "Email": "amet.nulla@Vestibulumante.ca", 
     "Company": "Donec Egestas Foundation" 
    }, { 
     "Name": "Kane", 
     "Email": "Duis.mi@consectetueradipiscingelit.net", 
     "Company": "Arcu Institute" 
    }, { 
     "Name": "Kasper", 
     "Email": "magna.Phasellus.dolor@velconvallisin.co.uk", 
     "Company": "Tempor LLP" 
    }]; 


    var doc = new jsPDF('p', 'pt', 'a4'); 
    //Dimension of A4 in pts: 595 × 842 

    var pageWidth = 595; 
    var pageHeight = 842; 
    var y=500; 
    var pageMargin = 10; 

    pageWidth -= pageMargin * 2; 
    pageHeight -= pageMargin * 2; 

    var cellMargin = 5; 
    var cellWidth = 250; 
    var cellHeight = 60; 

    var startX = pageMargin; 
    var startY = pageMargin; 

    function createCard(item) { 

     // doc.getTextDimensions(item.Name); turncate or split string if you needed 

    if (startY >= pageHeight) 
{ 
    doc.addPage(); 
    startY = pageMargin // Restart height position 
} 

     doc.text(item.Name, startX, startY); 
     doc.text(item.Email, startX, startY + 20); 
     doc.text(item.Company, startX, startY + 40); 

     var nextPosX = startX + cellWidth + cellMargin; 

     if (nextPosX > pageWidth) { 
     startX = pageMargin; 
     startY += cellHeight; 
     } else { 
     startX = nextPosX; 
     } 

    } 


    for (var i = 0; i < data.length; i++) { 
     createCard(data[i]); 
    }