2017-09-03 2 views
3

웹 응용 프로그램에서 JSPDF Autotable을 사용하여 PDF를 작성하고 있습니다. 문제는 데이터가 동적 (나는 AngularJS 1.x를 사용할 것임)이고 행에 다른 높이가있을 수 있다는 것입니다.JSPDF Autotable이 행을 나누기

일부 경우 Autotable은 페이지의 마지막 행을 나누어 다음 페이지로 계속됩니다. 이 동작을 방지하고 마지막 행 (기본값은 깨지기)을 취하도록 다음과 같은 페이지로 가져 오도록 Autotable을 설정하려면 어떻게해야합니까? 내가 스타일에서 일부 설정을 변경해야 할 것 같아요 https://jsfiddle.net/9vgxvfkh/1/

:

내 코드입니다

styles: { 
    cellPadding: 1.5, 
    overflow: 'linebreak', 
    valign: 'middle', 
    halign: 'center', 
    lineColor: [0, 0, 0], 
    lineWidth: 0.2 
}, 
pageBreak: 'always' 

그러나 나는 시도하고 그것이 작동하지 않았다.

P .: 헤더의 여백 위쪽은 이미지를 추가하기 때문입니다.

+0

업데이트 된 답변을 확인하십시오. 그 해결책이 당신에게 받아 들여질 수 있습니까? – luke

+0

네, 고마워요! – panagulis72

답변

1

불행히도 일부 매개 변수 나 스타일을 사용하여이를 수행 할 방법이 없습니다.

빠른 디버그를 수행하여 문제의 해결책을 찾았습니다. 소스 코드를 약간 수정해야합니다.

image

은 소스 코드에서 I는 행 페이지 (방법 canFitOnPage)에 들어갈 수 있는지 체크가 그 후 각 행에있어서 printFullRow가 호출되고 있음을 발견 하였다.

행을 페이지에 맞출 수없는 경우 행에 몇 줄의 텍스트가 포함되어 있는지 확인합니다 (내 경우 10입니다). 행 수가 1보다 커지기 때문에 행이 분할됩니다.

이 숫자를 더 큰 값으로 변경해야합니다. 추가 버그를 피하려면 전체 페이지 높이에 맞는 줄 수를 확인하고이 숫자를 1 대신 넣어야합니다. 엄청난 양을 선택하면 텍스트가 너무 길어서 페이지 전체에 맞지 않을 수도 있습니다. common_1.addPage()이 끝없이 실행되기 때문에 전혀 렌더링되지 않습니다.

은 다음과 같이 뭔가 변화 라인 (470)을 요약하면 :

if (row.maxLineCount <= 50) { 

50 않는 한 라인이 페이지에 맞지 않을 수 있습니다 ...

하기 전에 : enter image description here

후 : 를 enter image description here

업데이트 된 피들을 확인하십시오. https://jsfiddle.net/9vgxvfkh/2/