html을 pdf로 변환 하는데 .. 가로방향과 여백 질문 ..!

html을 pdf로 변환 하는데 .. 가로방향과 여백 질문 ..!

QA

html을 pdf로 변환 하는데 .. 가로방향과 여백 질문 ..!

답변 1

본문

안녕하세요 초보 퍼블리셔입니다 ! 

브라우저를 pdf로 저장하는데 스크립트에서 어려움을 겪고있어서 도움좀 부탁드립니다 .ㅠㅠ

//pdf저장하기

        $(document).ready(function() {
    $('#savePdf').click(function() { // pdf저장 button id
        
        html2canvas($('#pdfDiv')[0]).then(function(canvas) { //저장 영역 div id
        
        // 캔버스를 이미지로 변환
        var imgData = canvas.toDataURL('image/png');
             
        var imgWidth = 190 // 이미지 가로 길이(mm) / A4 기준 210mm
        var pageHeight = imgWidth * 1.414;  // 출력 페이지 세로 길이 계산 A4 기준
        var imgHeight = canvas.height * imgWidth / canvas.width;
        var heightLeft = imgHeight;
        var margin = 10; // 출력 페이지 여백설정
        var doc = new jsPDF('p', 'mm', 'a4');
        var position = 0;
           
        // 첫 페이지 출력
        doc.addImage(imgData, 'PNG', margin, position, imgWidth, imgHeight);
        heightLeft -= pageHeight;
             
        // 한 페이지 이상일 경우 루프 돌면서 출력
        while (heightLeft >= 20) {
            position = heightLeft - imgHeight;
            doc.addPage();
            doc.addImage(imgData, 'PNG', margin, position, imgWidth, imgHeight);
            heightLeft -= pageHeight;
        }
     
        // 파일 저장
        doc.save('file-name.pdf');

          
    });

    });
    
    
})

 

제가 이렇게 스크립트를 썼는데.. 가로방향으로 출력되게 하고싶거든요 ..

var doc = new jsPDF('l', 'mm', 'a4'); 여기까진 알겠는데 

나머지부분을 어떻게바꿔야할지 .ㅠㅠ바보같지만 너무 어려워서 질문드립니다 .

그리고 출력화면에 좌우여백만생기고 상하여백이 생기지않는데 그부분도 도움 부탁드립니다 ..!

 

 

이 질문에 댓글 쓰기 :

답변 1

        var imgWidth = 190 // 이미지 가로 길이(mm) / A4 기준 210mm
        var pageHeight = imgWidth * 1.414;  // 출력 페이지 세로 길이 계산 A4 기준
        var imgHeight = canvas.height * imgWidth / canvas.width;

 

이 부분, 가로,세크 크기 계산을

서로 바꿔야겠네요.

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
filter #html ×
전체 1,125
© SIRSOFT
현재 페이지 제일 처음으로